下拉菜单按钮

时间:2012-12-12 10:01:06

标签: javascript html

我有一个下拉菜单,当用户点击它时它将转发到链接Please click here to view我不想要任何按钮,只要用户选择类别它就会转发给他们。我想在用户想要点击菜单时删除该按钮,当选择它时将转发到域。请指导我。谢谢......

按钮代码是

<FORM name="mapform" method="POST">
<SELECT name="jump" size="1">
<OPTION value="" SELECTED>Select the Category</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=1">Ask a Question</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=4">Vehicle for Sale</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=8">Housing for Rent</option>
</SELECT>
<INPUT type=button onClick= "location = '' + document.mapform.jump.options[ document.mapform.jump.selectedIndex ].value;" value="Place an Ad!">
</FORM>

其他帮助:)如果可能的话,你能告诉我如何使这个按钮看起来像好主题......

3 个答案:

答案 0 :(得分:1)

onclick代码移至下拉列表的onchange事件:

<SELECT name="jump" size="1" onchange="window.location = this.value;">

虽然,我建议创建一个函数,而不是将所有代码都抛出到内联事件中,因为您需要检查是否选择了Select the Category选项,因此不会重定向。

<script>
function changeCategory(value)
{
    if(value != "")
    {
        window.location = value;
    }
}
</script>

<SELECT name="jump" size="1" onchange="changeCategory(this.value)">

答案 1 :(得分:1)

试试这个 HTML

<SELECT name="jump" id="jump" size="1">
<OPTION value="" SELECTED>Select the Category</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=1">Ask a Question</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=4">Vehicle for Sale</option>
<OPTION value="http://www.mydomain.com/posting.php?mode=post&f=8">Housing for Rent</option>
</SELECT>

JQUERY SCRIPT

<script>
    $(function(){

      $('#jump').bind('change', function () {
          var url = $(this).val(); // get selected value
          if (url) { // require a URL
              window.location = url; // redirect
          }
          return false;
      });
    });
</script>

答案 2 :(得分:1)

你必须在onChange of the drop-down时触发它。

在该下拉列表的onChange中,您可以调用Javascript函数,在该函数中可以重定向它。

OR

您可以为<select>创建一个id并创建onchange事件:

<SELECT name="jump" size="1" id="category">
<script type="text/javascript">
   $(document).ready(function() {
      $("#category").onchange(function() {
        // do redirect here  ....................
      });
   });
</script>