Jquery .click（）不触发事件

Question

我想向.click函数添加条件语句。

$(document).ready(function() { 
    function runEffect() { 
     var selectedEffect = "blind"; 
     var form = $("#forms").val(); 
     if (form == "Equipment") { 
      $("#effect2").toggle(selectedEffect, 500); 
     } else { 
      $("#effect").toggle(selectedEffect, 500); 
     } 
    }; 
    $("#button").click(function() { 
     runEffect(); 
    }); 
}); 

HTML部分：

<select name="inquiryOptions" id = "forms"> 
     <option value="" selected></option> 
     <option value="Equipment">Equipment Requested to Site</option> 
     <option value="Equipment Return Request">Equipment Return Request</option> 
     <option value="Equipment Forwarding Site to Site Request">Equipment Forwarding Site to Site Request</option> 
     <option value="Other Move Request">Other Move Request</option> 
</select> 
<button id="button" class="ui-state-default ui-corner-all">Next</button> 

<div id="effect" class="ui-widget-content ui-corner-all" style="display:none"> 
<form action="#" method ="POST" id ="mainForm_3"> 

... 
</form> 
</div> 

影响二是完全一样的，但与表单内不同的领域... 任何反馈是极大的赞赏，感谢您的时间。

Answer 1

我会打破你的函数出来的文件准备好，然后用。对你的事件处理程序绑定到你的选择：

看看jQuery的API切换（），作为你不使用它正确的方式：http://api.jquery.com/toggle/

您也在说切换#effect &＃effect2不存在于您的网页上。看到我的小提琴下面，你会看到什么切换。

function runEffect() { 
    var selectedEffect = "blind"; 
    var form = $("#forms").val(); 

    if (form == "Equipment") { 
     console.log('Equipment=true'); 
     $("#effect2").toggle(); 
    } else { 
     console.log('Equipment=false'); 
     $("#effect").toggle(); 
    } 
} 

$(document).ready(function() { 
    $("#button").on('click', function() { 
     runEffect(); 
    }); 
}); 

现在你只需要定义你的selectedEffect。

这里是一个小提琴来帮助你：http://jsfiddle.net/ju9qz4vd/3/