喵喵笨兔 の 喵喵的家~遊戲天地 - 首頁(上版面)
000webhost logo
喵喵笨兔 の 喵喵的家~遊戲天地 - 首頁(左版面)
首  頁 最新消息 遊戲攻略 遊戲影片 遊戲圖片 下載區 學習分享 留言板 FB粉絲團
 喵喵笨兔 の 喵喵的家~遊戲天地 - PHP 網頁下拉選單 <select>,選完表單 <form> 自動送出,且保留選中值而不返回預設值

PHP 網頁下拉選單 <select>,選完表單 <form> 自動送出,且保留選中值而不返回預設值

 

javascript 寫法1:

<!doctype html>
<html>
<body>

<form id="form1" action="" method="GET">
  <select id="test" name="test" onchange="submit();">
    <option value="">請選擇</option> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    <option value="C">C</option> 
  </select> 
</form>

<script>
	document.getElementById('test').value='<?=$_GET['test'] ?>'; //保留下拉所選
</script>

</body>
</html>

javascript 寫法2:

<!doctype html>
<html>
<body>

<form id="form2" action="" method="GET">
  <select id="test1" name="test1" onchange="submit();">
    <option value="">請選擇</option> 
    <option value="A" <?php if($_GET['test1']=='A'){ echo 'selected';} ?>>A</option> 
    <option value="B" <?php if($_GET['test1']=='B'){ echo 'selected';} ?>>B</option> 
    <option value="C" <?php if($_GET['test1']=='C'){ echo 'selected';} ?>>C</option> 
  </select> 
</form>
</body>
</html>

jquery 寫法:

  • 筆者只是把表單送出改成 jquery 語法來做個比較而已,其它與 javascript 寫法一樣。
<!doctype html>
<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>

<script>
  $(function(){
        $('#selecttest').change(function(){
				$('#frmtest').submit();
			});
		});
</script>
</head>

<body>
<form id="frmtest" action="" method="GET">
  <select id="selecttest" name="test">
    <option value="">請選擇</option> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    <option value="C">C</option> 
  </select> 
</form>

<script>
	document.getElementById('test').value='<?=$_GET['selecttest'] ?>'; //保留下拉所選
</script>

</body>
</html>

 

笨兔隨手筆記於 2017/12/22

喵喵笨兔 の 喵喵的家~遊戲天地
http://vv0817.tk
http://vvv.myweb.hinet.net