Question

我无法使用下拉列表找出如何导航到不同的网页并提交。我有三种形式：

main.php
two.php
three.php

在我的main.php页面中，我有一个下拉列表，其中只包含两个选项＆＃39; second＆＃39;和第三个＆＃39;。如何使用这两个选项导航到其他php页面？例如，如果我选择了“＆＃39; two＆＃39;然后单击“提交”，页面应该转到second.php页面。如果我选择选项＆＃39; three＆＃39;，我将被带到第三个.php页面。

此外，一旦我被引导到其中一个php页面，我怎么能够回到＆＃39; main.php＆＃39;页面如果我决定转到其他php页面而不是？（我想也许是使用后退按钮）。

以下是我的主要内容的一部分＆＃39;页：

<label>Select the page you wish to go:</label></td>
    <select name="pages"/>
        <option value="two.php">Second</option>
        <option value="three.php">Third</option>
    </select></td>

Answer 1

关于<select></select>值更改：

HTML：

<select name="pages" onChange="my_function(this)">

JavaScript：

function my_function(element){
     document.location.href = element.value
}

Example

点击<button></button>点击：

HTML：

<button onClick="my_function()"></button>

JavaScript：

function my_function(){
     document.location.href = document.querySelector('select[name="pages"]').value
}

Example

Answer 2

你可以做多件事。如果您不依赖于javascript，请将表单提交到router.php这样的文件。

在router.php内置：

<?php
    if (isset($_POST['pages']) {
        header('Location: ' . $_POST['pages']);
    }

这将有效地将请求转发到您在select中提交的页面。

你还需要改变你的html：

<label>Select the page you wish to go:</label></td>
<form method="post" action="router.php">
   <select name="pages"/>
      <option value="two.php">Second</option>
      <option value="three.php">Third</option>
   </select>
   <input type="submit" value="go there" />
</form>

如果你对javascript很好，请使用 @notulysses 的答案，它的方式更容易，更快。
直接在标题方法中使用POST值有点讨厌imo。

Answer 3

Jquery解决方案

HTML CODE：

 <form id="frm"  method="post" action="" >
  <label>Select the page you wish to go:</label>
    <select name="pages"/>
       <option value="two.php">Second</option>
       <option value="three.php">Third</option>
   </select>
  <input type="submit" name="sub"  value="Finish" />
 </form>

JQUERY CODE

      $('#frm').on('submit',function () {
          var nextPage= $('select option:selected').val();  
          $(this).attr('action',nextPage);
          return true;
      });

快乐编码：）

如何使用下拉列表导航到其他php页面？

3 个答案: