Question

这是我的HTML代码：

<select name="field">
    <option value="Camera">Camera</option>
    <option value="Clothing">Clothing</option>
    <option value="Coins">Coins</option>
    <option value="Mobile">Mobiles</option>
</select>

现在我想要“如果我选择相机，那么我将重定向到另一个页面可能是camera.html页面。同样如果我选择服装然后我将重定向到另一个页面可能是衣服**页面以相同的方式为其他2选项以及我想要相同的功能。

如果使用4个不同的链接使用标签，我会很容易，但我希望使用表单的提交按钮完成此操作。我想用选择框和提交电话而不是4个不同的链接来做这件事..

所以我非常需要这方面的帮助..请帮助我并用代码向我解释这个我能理解我怎样才能实现这个目标？

Answer 1

我会添加一个像这样的JavaScript处理程序：

<select onchange="location.href=this.value+'.html'">

如果您想使用提交按钮执行此操作，则需要添加更多代码：

<form onsubmit="location.href=this.form.target.value; return false;">
  <select name="target">...</select>
  <input type="submit" />
  ...

Answer 2

如果您不想依赖JavaScript，只需让表单通过GET传递数据即可。这样，您就可以访问.htaccess中的选定选项。通过RewriteCond，您可以将操作重写到所需的页面：

<form method="get" action="nonexistent.html">
    <select name="gotofile">
        <option value="camera">Camera</option>
        <option value="clothing">Clothing</option>
        <option value="coins">Coins</option>
        <option value="mobile">Mobiles</option>
    </select>
</form>

在.htaccess-File：

中

RewriteEngine On
RewriteCond %{QUERY_STRING} ^gotofile=([^&]+) [NC,OR]
RewriteCond %{QUERY_STRING} &gotofile=([^&]+) [NC]
RewriteRule ^nonexistens\.html$ %1.html

Answer 3

您可以将“value”属性设置为指向要转到的网址/网页，然后使用JavaScript（或jQuery）重定向用户。

E.g。

<html>
    <head>
        <script type="text/javascript">

        function redirect() {

            var myUrl = document.getElementById("selectBox").value;
            window.location.href = myUrl;

            return false;

        }

        </script>
    </head>
    <body>
        <form onSubmit="return redirect()">
        <select id="selectBox" name="field">
            <option value="Camera.html">Camera</option>
            <option value="Clothing.html">Clothing</option>
            <option value="Coins.html">Coins</option>
            <option value="Mobile.html">Mobiles</option>
        </select>
        <input type="submit" />
        </form>
    </body>
</html>

编辑：我已根据您的要求更新了我的代码以使用onSubmit（）。

Answer 4

如果我正确理解了您的问题，您希望选择项目成为链接。如果这确实是你要求的那么简单的

<option><a href=`yoursite.html`>something</a></option>

应该工作

Answer 5

使用jQuery真的很好，很容易做到这一点。 jQuery库可以在http://jquery.com/download/下载。

我建议将页面名称添加为vales或命名页面，以便值包含在页面名称中（例如，如果页面名称为cameraPage.html，则相机选项的值为“cameraPage” “或”cameraPage.html。以下示例将使用cameraPage，但您可以随意更改它。）

$("formName").submit(function(){
   window.location.href = $('option:selected').val()+".html";
});

选择 $（“formName”）选择您的表单， .submit（function（）表示您现在正在提交表单时执行功能。

“window.location.href =”将用户重定向到=后的内容。

$（'option：selected'）。val（）获取所选选项的值。

希望这有帮助。

Answer 6

您也可以使用PHP和javascript重定向执行此操作这是表单的html：

<form action="yourscript.php" method="post">
   <select name="field">
      <option value="Camera">Camera</option>
      <option value="Clothing">Clothing</option>
      <option value="Coins">Coins</option>
      <option value="Mobile">Mobiles</option>
   </select>
   <input type="submit" value="Submit">
</form>

这是你的script.php中的php：

<?PHP
$field = $_POST['field'];
if ($field == "Camera"){
   ?>
   <script type="text/javascript">
   window.location.href='cameras.php';
   </script>
   <?PHP
}
else if ($field == "Clothing"){
    ?>
    <script type="text/javascript">
    window.location.href='clothing.php';
    </script>
    <?PHP
}
else if ($field == "Coins"){
    ?>
    <script type="text/javascript">
    window.location.href='coins.php';
    </script>
    <?PHP
}
else if ($field == "Mobile"){
    ?>
    <script type="text/javascript">
    window.location.href='mobile.php';
    </script>
    <?PHP
}
?>

我想在html选择框中添加4个不同的条件

6 个答案: