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

Multiple submit buttons based on dropdown choice

本文关键字:提交 按钮 于下拉 选择      更新时间:2023-09-26

新手问题。。。想知道javascript是否可以成为解决方案?

有没有可能有一个包含许多选项的下拉菜单。然后,根据选择的选项来确定两个提交按钮的操作?

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

为什么不在按钮的onClick方法上绑定一个javascript函数呢。然后在该功能中,您可以查询下拉列表框中的当前选择并执行相应的操作?

是的,您可以轻松使用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);      
});