javascript - 下拉项目上的单击事件 - jquery

Question

从下拉列表项中选择元素时，我想触发单击事件。每个点击事件应该根据下拉元素的值而有所不同。

 <select id="cmbMoreFunction" name="cmbMoreFunction" multiple="multiple">
            <option value="0">ATM Event Status</option>
            <option value="1">Statistics</option>
 </select>

如果我单击“ATM 事件状态”，则只有其特定的单击事件才会被触发。

我试过这个..但不起作用

 $('#cmbMoreFunction select option').click(function() 
 { 
    //Depend on Value i.e. 0 or 1 respective function gets called. 
 });

基本上我只是不想在我的页面上有另一个按钮来捕获所有值然后触发事件。

Answer 1

在选择上使用更改处理程序，读取它的值，然后决定要做什么：

$('#cmbMoreFunction').change(function() 
{ 
    var selectedValue = parseInt(jQuery(this).val());

    //Depend on Value i.e. 0 or 1 respective function gets called. 
    switch(selectedValue){
        case 0:
            handlerFunctionA();
            break;
        case 1:
            handlerFunctionB();
            break;
        //etc... 
        default:
            alert("catch default");
            break;
    }
});

function handlerFunctionA(){
    alert("do some stuff");    
}

function handlerFunctionB(){
    alert("Do some other stuff");
}

​</p>

这是一个有效的小提琴示例

Answer 2

检查这个JsFiddle

简单使用此代码 JQuery：

$('#cmbMoreFunction').click(function(v){
  console.log(v.target.value);
  });

希望您的问题将得到解决。

Answer 3

选项元素不会有点击事件。Click 事件仅与 Select 元素相关联，因此您必须将其应用于选择下拉列表。在选择下拉菜单的点击事件触发的函数中，您可以检查各个选项并应用您的逻辑。

Answer 4

您也可以使用 JavaScript。例如。

$document.ready(function(){
$('#cmbMoreFunction').change(function(){

var dataValue=document.getElementById('cmbMoreFunction').value;
if(dataValue==0){call functionFirst();}
else{call functionSecond();}
});
});