javascript - 基于下拉选择的多个提交按钮

Question

新手问题...想知道javascript是否可以解决问题？

是否可以有一个带有多个选项的下拉菜单。那么，根据选择哪个选项来确定两个提交按钮的动作呢？

在这种情况下，每个提交按钮将根据下拉列表中选择的选项链接到...每个按钮上的链接不同？

Answer 1

为什么不只是将一个javascript函数绑定到按钮的onClick方法。然后在该函数内部，您可以查询下拉列表框的当前选择并执行适当的操作？

Answer 2

是的，您可以轻松地使用 Jquery。在做出下拉选择后，您只需将点击事件分配给提交按钮。

查看http://api.jquery.com/change/将更改事件处理程序添加到下拉列表中。在更改事件处理程序中为提交按钮设置适当的单击处理程序。

这是一个例子。 http://jsfiddle.net/24Vbr/6/

HTML

    <form>
      <input class="target" type="text" value="Field 1" />
        <select class="target">
          <option value="option1" selected="selected">Option 1</option>
          <option value="option2">Option 2</option>
        </select>  
      <button id='button1' type="button">Button with changing click handler based on dropdown </button>
    </form>
    <div id="other">
  Trigger the handler

---

js

var onSubmit1 = function()
{
    alert('submit1');
};

var onSubmit2 = function()
{
    alert('submit2');
};



$('.target').change(function(e) {    
    var dropdown = $('.target');
    var text = $( ".target option:selected" ).text();    

    var $button1= $('#button1');
    $button1.unbind('click');

    if(text == "Option 1"){
         $button1.click(onSubmit1);
        return;
    }

   $button1.click(onSubmit2);      
});