為什麼按按鈕鍵連結php失效按F5才能按有效果

php php7 php mysql 資料管理 javascript

stevenhappy99 2019-05-27 18:33:05 ‧ 4666 瀏覽

分享至

最近管理員系統，這算是作業，我剛學，最近都會遇到問題只能求救
現在有一個問題進入登入頁面按加入管理員鍵失效還要
按F5後才能加入鍵有效果
login.htm是登入，join.htm加入管理員頁面，addmember.php是加入管理員的PHP，checkpwd.php是驗證密碼，logout.php是登出,index.php(首頁)管理員一些功能
,dbtools.inc.php是連資料庫
資料庫goodsapp

資料表worker欄位為id,username,password
id,username,password
0,root,123456
0,root2,root2

以下是加入管理員鍵按了沒反應的錯誤圖

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=yes, maximum-scale=1, minimum-scale=1, width=device-width" />

<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css">
<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="">
	<div data-role="header" data-position="fixed" data-theme="b">
	
		<div data-role="navbar" data-theme="e">
		
		</div>
	</div>
	<div data-role="content">
	<title>管理員登入</title>
    <p align="center"><img src=""></p>  
    <p></p>
    <form action = "checkpwd.php" method = "post" name = "myForm" id = "myForm">
      <table width="40%" align="center">
        <tr> 
          <td align="center"> 
            <font color = "#3333FF">帳號：</font> 
            <input name = "username" type = "text" size = "15" id = "username" required>
          </td>
        </tr>
        <tr> 
          <td align="center"> 
            <font color = "#3333FF">密碼：</font> 
            <input name="password" type="password" size="15" id = "password" required>
          </td>
        </tr>
        <tr>
          <td align="center"> 
            <input type="submit" value="登入">      　 
            <input type="reset" value="重填">
          </td>
        </tr>
      </table>
    </form>
    <p align="center">
	<a href="join.htm">加入管理員</a>
 
      <a href=""></a></p>
  </body>
  <script type="text/javascript">
    const myForm = document.getElementById('myForm');
    myForm.addEventListener('submit', (e) => {
      /*
      const account = document.getElementById('account').value;
      const password = document.getElementById('password').value;
      if (account === '' || password === '') {
        alert("帳號或密碼欄位不可以空白哦！");
        e.preventDefault();
        return false;
      }
      */
      myForm.submit();
    });
  </script>

 


</body>
</html>

join.htm

<html>
  <head>
    <title>加入管理員</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
      function check_data()
      {
        if (document.myForm.username.value.length == 0)
        {
          alert("「使用者帳號」一定要填寫哦...");
          return false;
        }
        if (document.myForm.username.value.length > 10)
        {
          alert("「使用者帳號」不可以超過 10 個字元哦...");
          return false;
        }
        if (document.myForm.password.value.length == 0)
        {
          alert("「使用者密碼」一定要填寫哦...");
          return false;
        }
        if (document.myForm.password.value.length > 10)
        {
          alert("「使用者密碼」不可以超過 10 個字元哦...");
          return false;
        }
        if (document.myForm.re_password.value.length == 0)
        {
          alert("「密碼確認」欄位忘了填哦...");
          return false;
        }
        if (document.myForm.password.value != document.myForm.re_password.value)
        {
          alert("「密碼確認」欄位與「使用者密碼」欄位一定要相同...");
          return false;
        }
        	
        myForm.submit();					
      }
    </script>		
  </head>
  <body>
    <p align="center"><img src=""></p>
    <form action="addmember.php" method="post" name="myForm">
      <table border="2" align="center" bordercolor="#6666FF">
        <tr> 
          <td colspan="2" bgcolor="#6666FF" align="center"> 
            <font color="#FFFFFF">請填入下列資料 (標示「*」欄位請務必填寫)</font>
          </td>
        </tr>
        <tr bgcolor="#99FF99"> 
          <td align="right">*使用者帳號：</td>
          <td><input name="username" type="text" size="15">
          (請使用英文或數字鍵)</td>
        </tr>
        <tr bgcolor="#99FF99"> 
          <td align="right">*使用者密碼：</td>
          <td><input name="password" type="password" size="15">
          (請使用英文或數字鍵)</td>
        </tr>
        <tr bgcolor="#99FF99"> 
          <td align="right">*密碼確認：</td>
          <td><input name="re_password" type="password" size="15">
          (再輸入一次密碼)</td>
        </tr>
        <tr bgcolor="#99FF99">
          
        </tr>
        <tr bgcolor="#99FF99"> 
        
          
          </td>
        </tr>
        <tr bgcolor="#99FF99"> 
         
          </td>
        </tr>
        <tr bgcolor="#99FF99"> 
         
        </tr>
        <tr bgcolor="#99FF99"> 
         
        </tr>
        <tr bgcolor="#99FF99"> 
         
        </tr>
        <tr bgcolor="#99FF99">
         
        </tr>
        <tr bgcolor="#99FF99"> 
        
        </tr>
        <tr bgcolor="#99FF99"> 
        
        </tr>
        <tr bgcolor="#99FF99"> 
          <td align="center" colspan="2"> 
            <input type="button" value="加入管理員" onClick="check_data()">　
            <input type="reset" value="重新填寫">
          </td>
        </tr>
      </table>
    </form>
  </body>
  
  
</html>

addmember.php

<?php
  require_once("dbtools.inc.php");
  
  //取得表單資料
  $username = $_POST["username"];
  $password = $_POST["password"]; 
 
  //建立資料連接
  $link = create_connection();
			
  //檢查帳號是否有人申請
  $sql = "SELECT * FROM worker Where username = '$username'";
  $result = execute_sql("goodsapp", $sql, $link);

  //如果帳號已經有人使用
  if (mysql_num_rows($result) != 0)
  {
    //釋放 $result 佔用的記憶體
    mysql_free_result($result);
		
    //顯示訊息要求使用者更換帳號名稱
    echo "<script type='text/javascript'>";
    echo "alert('您所指定的帳號已經有人使用，請使用其它帳號');";
    echo "history.back();";
    echo "</script>";
  }
	
  //如果帳號沒人使用
  else
  {
    //釋放 $result 佔用的記憶體	
    mysql_free_result($result);
		
    //執行 SQL 命令，新增此帳號
    $sql = "INSERT INTO worker (username, password) VALUES ('$username', '$password')";

    $result = execute_sql("goodsapp", $sql, $link);
  }
	
  //關閉資料連接	
  mysql_close($link);
?>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>新增帳號成功</title>
  </head>
  <body bgcolor="#FFFFFF">
    <p align="center"><img src="Success.jpg">       
    <p align="center">恭喜您已經註冊成功了，您的資料如下：（請勿按重新整理鈕）<br>
      帳號：<font color="#FF0000"><?php echo $username ?></font><br>
      密碼：<font color="#FF0000"><?php echo $password ?></font><br>       
      請記下您的帳號及密碼，然後<a href="login.htm">登入網站</a>。
    </p>
  </body>
</html>

checkpwd.php

<?php
  require_once("dbtools.inc.php");
  header("Content-type: text/html; charset=utf-8");
	
  //取得表單資料
  $username = $_POST["username"]; 	
  $password = $_POST["password"];

  //建立資料連接
  $link = create_connection();
					
  //檢查帳號密碼是否正確
  $sql = "SELECT * FROM worker Where username = '$username' AND password = '$password'";
  $result = execute_sql("goodsapp", $sql, $link);

  //如果帳號密碼錯誤
  if (mysql_num_rows($result) == 0)
  {
    //釋放 $result 佔用的記憶體
    mysql_free_result($result);
	
    //關閉資料連接	
    mysql_close($link);		
		
    //顯示訊息要求使用者輸入正確的帳號密碼
    echo "<script type='text/javascript'>";
    echo "alert('帳號密碼錯誤，請查明後再登入');";
    echo "history.back();";
    echo "</script>";
  }
	
  //如果帳號密碼正確
  else
  {
    //取得 id 欄位
    $id = mysql_result($result, 0, "id");
	
    //釋放 $result 佔用的記憶體	
    mysql_free_result($result);
		
    //關閉資料連接	
    mysql_close($link);				

    //將使用者資料加入 cookies
    setcookie("id", $id);
    setcookie("passed", "TRUE");		
    header("location:index.php");		
  }
?>

dbtools.inc.php

<?php
  function create_connection()
  {
    $link = mysql_connect("localhost", "root", "00000000")
      or die("無法建立資料連接<br><br>" . mysql_error());
	  
    mysql_query("SET NAMES utf8");
			   	
    return $link;
  }
	
  function execute_sql($database, $sql, $link)
  {
    $db_selected = mysql_select_db($database, $link)
      or die("開啟資料庫失敗<br><br>" . mysql_error($link));
						 
    $result = mysql_query($sql, $link);
		
    return $result;
  }
?>

logout.php

<?php
  //清除 cookie 內容
  setcookie("id", "");
  setcookie("passed", "");
	
  //將使用者導回主網頁
  header("location:login.htm");
  exit();
?>

index.php 首頁程式碼

<?php



header("Content-Type: text/html; charset=utf-8");
include("connsql.php"); //連結資料庫檔案
$seldb = @mysql_select_db("goodsapp"); //連結資料庫
if (!$seldb) die("資料庫選擇失敗！");

$sql_query = "SELECT `orderid`,`phone`,`name` FROM `orders` WHERE `finish`=0 ORDER BY `orderid` DESC";
$result = mysql_query($sql_query);
$numrow = mysql_num_rows($result);
$row_result = array();
$i = 0;
while($row_result[$i] = mysql_fetch_array($result, MYSQL_ASSOC)){
$i++;
}


//檢查 cookie 中的 passed 變數是否等於 TRUE
$passed = $_COOKIE["passed"];

/* 如果 cookie 中的 passed 變數不等於 TRUE
表示尚未登入網站，將使用者導向首頁 login.htm	*/
if ($passed != "TRUE")
{
header("location:login.htm");
exit();
}
?>
<html>
<head>
<title>訂購系統</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

</html>




<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=yes, maximum-scale=1, minimum-scale=1, width=device-width" />
<title>訂購系統</title>
<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css">
<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="listOrder">
<div data-role="header" data-position="fixed" data-theme="b">
<h1>訂單查詢-選擇訂單</h1>
<div data-role="navbar" data-theme="e">
<ul>
<li><a href="index.php" class="ui-btn-active">查詢未處理訂單</a></li>
<li><a href="historyorder.php">查詢歷史訂單</a></li>
<li><a href="itemSort.php">銷售排行榜</a></li>
</ul>
</div>
</div>
<div data-role="content">
<body>
<p align="center"><img src=""></p>
<p align="center">
<a href="delete.php">刪除管理員資料</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="logout.php">登出網站</a>
</p>

<ul data-role="listview" data-inset="true" id="lstOrder" data-filter="true" data-filter-placeholder="輸入訂單號碼、電話或姓名">
<?php for($i=0; $i<$numrow; $i++) { ?>
<li><a href='showorder.php?order=<?php echo $row_result[$i]["orderid"]; ?>' data-ajax='false'>
<?php echo $row_result[$i]["orderid"]; ?>　　
<?php echo $row_result[$i]["phone"]; ?>　　
<?php echo $row_result[$i]["name"]; ?>
</a></li>
<?php } ?>
</ul>
</div>
</div>


</body>
</html>

看更多先前的討論...收起先前的討論...

淺水員 iT邦大師 6 級 ‧ 2019-05-27 20:24:25 檢舉

覺得寫法好古老，學校都這樣教嗎？(只是閒聊)

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-27 23:14:21 檢舉

這個範例是圖書館找的書很舊了自己本身程式也爛

淺水員 iT邦大師 6 級 ‧ 2019-05-27 23:49:25 檢舉

檢查看看 logout.php 那邊有沒有錯誤吧，你上面沒貼到這個檔案。

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-27 23:59:14 檢舉

貼了

weiclin iT邦高手 4 級 ‧ 2019-05-28 08:56:14 檢舉

還在用 mysql_connect? 你找一本 php7 的書好不好, 你這個根本沒辦法跑 php7

淺水員 iT邦大師 6 級 ‧ 2019-05-28 10:32:28 檢舉

撇開舊寫法不談，我測試可以成功註冊跟登入跟登出(只是沒有index.php頁面)，無法重現你的問題。下面是一些教學資源，可以參考看看：
PDO的使用：https://ithelp.ithome.com.tw/articles/10183166
w3c 對 font 等標籤的描述：https://www.w3schools.com/tags/tag_font.asp

dragonH iT邦超人 5 級 ‧ 2019-05-28 10:39:49 檢舉

樓上跟我在他上一篇測的結果一樣

code一字不改也沒他這問題

柯柯 iT邦新手 2 級 ‧ 2019-05-28 11:12:54 檢舉

html 改這樣
<input type="button" value="加入管理員" id="join">

JQuey改成這樣
$( document ).ready(function() {
$('#join').on('click',function(){ code; });
});

ccutmis iT邦高手 2 級 ‧ 2019-05-28 11:50:26 檢舉

樓主應該先做的事情是
1. 開啟 Google Chrom 瀏覽器
2. 搜尋 "提問的智慧"

Luis-Chen iT邦新手 4 級 ‧ 2019-05-28 12:06:47 檢舉

我猜是沒有設初始值　ＣＯＮＳＯＬＥ．ＬＯＧ一下　為什麼　ＣＨＥＣＫ＿ＤＡＴＡ　ＮＯＴ　ＤＥＦＩＮＥＤ　還是你根本沒宣告？

ccutmis iT邦高手 2 級 ‧ 2019-05-28 13:17:00 檢舉

那個圖片的錯誤訊息與樓主問的問題風牛馬不相及
他說join.htm的加入管理者按鈕有問題
而join.htm按了表單資料是送到addmember.php
然而圖片的錯誤訊息是來自logout.php
發送表單資料到addmember.php 怎麼會自己跳到 logout.php?
由上面源碼看不出關聯性
因此我的感覺是他其實並沒有把真正造成問題的那一段源碼貼出來

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 14:41:38 檢舉

按登出鍵後logout.php 顯示卡在網址好像也沒有跑到登入頁面 ...

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 15:48:35 檢舉

首頁PHP黨也補上了

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

ccutmis

iT邦高手 2 級 ‧ 2019-05-28 17:25:47

最佳解答

我不是來幫樓主解作業的　只是給您一些建議
樓主提到你剛學　既然是剛學　那最好是按部就班來學
舉個例子來說　你貼的網頁源碼裡面很多是混合php判斷跟html片段
這種頁面對有經驗的老手來說沒什麼
但是對新手學習來說很容易讓腦子變成一砣漿糊

我寫了一個簡單範例：
驗證登入，進入後台才能新增管理員(使用PDO操作mysql)

(1) index.php (首頁) 點 [登入] 轉↓
(2) login.php (登入頁) 輸入帳密按 [登入] 轉↓
(3) checkpwd.php (驗證帳密) 如果失敗會轉回login.php 如果成功會把帳號寫入session並轉↓
(4) main.php (後台首頁) 點 [ 新增管理員 ] 轉↓
(5) addWorker.php (新增管理員表單) 點 [ 新增管理員 ] 轉↓
(6) do_addWorker.php (執行新增管理員的SQL命令) 成功轉↓
(7) main.php (後台首頁) 這邊可以觀察管理員列表有沒有增加新的一筆，按 [ 登出 ]轉↓
(8) logout.php (登出處理) 這邊會把登入帳號session清楚並轉 index.php

後台相關頁面要用session作登入驗證，
如果不是以正常登入方式進入(例如直接打網址main.php)
會被導向至 login.php

db.pdo.conn.php　是PDO的資料庫連線字串設定
goodsapp.sql 是我這邊測試的資料表格＆資料匯出sql

這裡是打包的範例，給您作學習參考：
http://www.web3d.url.tw/goodsapp.zip

有些東西十年前出來的還是能參考，例如html css 語言基礎，但有些東西已經不合時宜了，
例如php4的sql操控方式，能不要用就最好不用，當然新跟舊都學會怎麼用也沒壞處就是了。

範例只是把基本功能做出來，並沒有做到最好，像防sql注入那些，請老手們莫怪，
這裡只是給樓主一些參考的東西。

提問，請先自己思考找問題，真的遇到瓶頸再發問，而不是把一土拉庫源碼丟上來讓網友debug。

回應 9
分享
檢舉

看更多先前的回應...收起先前的回應...

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 19:47:45 檢舉

請教我用你範例為什麼worker沒辦法新增管理員還是PDO要用別的方式匯入資料表

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 19:50:52 檢舉

是不是我PHP版本太低我是用那個套件php+mysql的請教會有影響嗎

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 20:49:27 檢舉

ccutmis iT邦高手 2 級 ‧ 2019-05-28 20:55:25 檢舉

你試試下載xampp php7的那個版本
https://www.apachefriends.org/zh_tw/download.html
安裝使用很簡單搜一下google教學

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-28 22:34:18 檢舉

我用最新的軟體，你的範例也沒辦法新增管理員，可以教一下嗎

ccutmis iT邦高手 2 級 ‧ 2019-05-28 23:47:01 檢舉

你說的最新的軟體是指 XAMPP 7.x 的版本嗎?
如果你是用Appserv8.6.0肯定是不行的因為php版本跟DB版本都不一樣
Appserv8.6.0(PHP5.6 DB:Mysql5.7)
XAMPP 7.x(PHP7.1 DB:Mariadb10.1)
我給你參考的範例是用XAMPP 7.x的環境寫的，
所以你要試的話最簡單的步驟就是:
1)安裝XAMPP 7.x(建議安裝目錄C:\xampp 比較好找)
2)開啟XAMPP 控制面板然後在Apache跟Mysql的項目右邊點[Start]
3)開啟瀏覽器在網址列打http://127.0.0.1/ 看XAMPP首頁有沒有成功跑出來，假如有的話就點右上角的[phpmyadmin]
4)進到[phpmyadmin]中先創一個新資料庫並命名為goodsapp
5)進到[goodsapp]資料庫點[SQL]按鈕，貼入下列內容

-- 資料表結構 `worker`

CREATE TABLE `worker` (
  `id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT,
  `username` varchar(20) COLLATE utf8_unicode_ci NOT NULL,
  `password` varchar(20) COLLATE utf8_unicode_ci NOT NULL,
  PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

-- 資料表的匯出資料 `worker`

INSERT INTO `worker` (`id`, `username`, `password`) VALUES
(1, 'admin', 'admin'),
(2, 'test1', 'test1'),
(3, 'test2', 'test2');

然後按右下方[執行]
6)成功的話你會看到db裡新增了一個worker的資料表，裡面有三筆資料
7)用檔案總管開啟 C:\xampp\htdocs (這裡就是網站根目錄) 新增一個目錄命名為"goodsapp"
8)把 goodsapp.zip內容解壓縮到 C:\xampp\htdocs\goodsapp 目錄
9)用記事本開啟C:\xampp\htdocs\goodsapp\db.pdo.conn.php 依照實際的db.username跟db.password作修改，改好之後存檔
10)上列都有正確執行的話，開啟網頁並在網址輸入http://127.0.0.1/goodsapp/ 應該就能正常跑了加油~

註: goodsapp.zip裡面的sql有點問題，沒有把id設為PRIMARY KEY及AUTO_INCREMENT

stevenhappy99 iT邦新手 5 級 ‧ 2019-05-29 16:16:19 檢舉

謝謝你啊我又加了刪除管理員這樣修改對嗎剛剛執行不出來
deleteWorker.php頁面如同doaddWorker.php頁面減少密碼輸入選單

do_deleteWorker.php

<?php //檢查session['username']是否存在
session_start();
if(!$_SESSION['username']){
	header('Location: login.php');
}else{
	//session['username']存在 接著檢查$_POST['username']及$_POST['password']是否存在
	if(isset($_POST['username'])){
		//POST變數username及password存在 執行SQL新增命令
		require_once('db.pdo.conn.php');
		$connection->exec("DELETE FROM  worker where username=.$_POST['username']");
		//新增成功轉導向main.php
		header('Location: main.php');
	}else{
		//POST變數username或password不存在轉導向main.php
		header('Location: main.php?errmsg=addWorker_fail');
	}
}
?>

deleteWorker.php

<script>
$(function(){
	// Document is ready
	$( "form" ).submit(function( event ) {
		//這裡寫你要驗證輸入的js 如果驗證不通過就用 event.preventDefault(); 中斷表單發送
	});
});
</script>
</head>
<body>

<div data-role="page" id="listOrder">
	<div data-role="header" data-position="fixed" data-theme="b">
		
		<div data-role="navbar" data-theme="e">
			
		</div>
	</div>
	<div data-role="content">

<h1>刪除管理員 [ <?php echo $current_user[1];?> 您好! ]</h1>
<form name="form2" method="post" action="do_deleteWorker.php">
<h2>請輸入管理員帳號名(英文加數字)
<input name="username" type="text" size="15" required>
</h2>

</h2>

<input type="submit" value="刪除管理員"/>
</form>
<p><a href="main.php">回上一頁</a></p>

		
	</div>
</div>


</body>

</html>

ccutmis iT邦高手 2 級 ‧ 2019-05-29 16:48:20 檢舉

在 do_deleteWorker.php裡的

$connection->exec("DELETE FROM  worker where username=.$_POST['username']");

改成

$connection->exec("DELETE FROM  worker where username='".$_POST['username']."'");

應該就能正確刪除了，這裡有個偵錯的小技巧給您參考，
do_deleteWorker.php應該是從 do_addWorker.php 修改而來的
它們的運行流程是
(1)判斷session[username]有沒有存在沒有就重導到登入頁
(2)判斷有沒有獲得POST變數，若有的話就執行SQL命令然後重導到main.php;若沒有就直接重導回main.php
如果你在這邊卡住了，可以把(2)裡面的重導註解掉例如
//新增成功轉導向main.php
//header('Location: main.php');
然後再把sql印出來，例如:
echo("DELETE FROM worker where username='".$_POST['username']."'");
再重新執行網頁看看螢幕列印出來的SQL哪裡有錯導致沒法正常執行
在適當位置設定中斷點是你學程式一定要會的技巧，
至於哪邊設定或怎麼設中斷點這個你多動腦多練習就會懂了。