重定向选择一个选择输入

Redirect on selecting a select input

本文关键字：选择 一个 输入 重定向      更新时间：2023-09-26
 <script type="text/javascript">
  var x = document.getElementById("mySelect").value;
</script>
<form action="something?val="+x enctype="multipart/form-data" method="post">
     <label>Select the Playlist:</label>
     <select name="select" id="mySelect">
      <option value="#">----Select-----</option>
      <option value="playlist1">Playlist1</option>
      <option value="playlist2">Playlist2</option>
     </select>
     <input type="submit">
</form>

现在我想当我选择playlist1并按下提交按钮时，我的页面应该重定向到某些东西?但这是在重定向吗?val = . .这里没有输出x的值。我找不到错误，请帮忙。

为您的表单指定id，以便更容易通过js访问，如:

...
<form id="myform" action="something" enctype="multipart/form-data" method="post">
...

并使用select元素的change event handler来更改表单的动作，例如:

var selectEle = document.getElementById("mySelect");
selectEle.onchange = function(event) {
    var selValue = event.target.value,  
    frm = document.getElementById("myform");
    frm.action = (selValue != "#") ? "something?val=" + selValue : "something";
}

var x = document.getElementById("mySelect").value;
//works just like a link
window.location.href = "/somewhere?x=" + x;

我给你一点解释你的代码的工作流程:

一旦页面加载以下行将运行(我假设你在头中编写以下js)。此时窗体未呈现所以x的值未定义，

    <script type="text/javascript">
      var x = document.getElementById("mySelect").value;
// this is not going to call automatically , when you change value of select box.
    </script>

一旦你的表单呈现，你改变了选择框的值，你需要调用一个函数来执行上面的js代码来获得新的值。

和其他问题是你在HTML中使用x的方式，x是一个javascript变量，所以它只能在标签内使用。

<form action="something?val="+x enctype="multipart/form-data" method="post">

对于你期望的结果，不需要javascript简单的html表单可以做到这一点，使用get的表单方法它把你的输入名称与值在url自动

<form action="something" method="get">
     <label>Select the Playlist:</label>
     <select name="val" id="mySelect">
      <option value="#">----Select-----</option>
      <option value="playlist1">Playlist1</option>
      <option value="playlist2">Playlist2</option>
     </select>
     <input type="submit">
</form>
相关文章：