jquery - 点击按钮不调用函数

Question

由于某种原因没有调用警报，有人可以帮我调试吗？

$(document).ready(function () { 
    // Keep filter hidden
    //$("#filter_bar").hide();

    $('#filter_bar').click(showFilterBar);

});

function showFilterBar(){
    alert('got in here');
    if ($("#filter_bar").is(":hidden")){
        $("#filter_bar").show();
    } 
    else
    {
        $("#filter_bar").hide();
    }
}

http://jsbin.com/imevax/1/edit

Answer 1

你忘了包括 JQuery :)

为我工作（Chrome）：

http://jsbin.com/imevax/22/edit

我所做的只是包括 JQuery。

编辑：更新以根据@mattijo 的建议以安全的方式指向最新的 1.x jquery 版本。

Answer 2

我通过改变你定义函数的方式让它工作：

showFilterBar = function(){
    alert('got in here');
    if ($("#filter_bar").is(":hidden")){
        $("#filter_bar").show();
    }else{
        $("#filter_bar").hide();
    }
};

$(document).ready(function () { 
    // Keep filter hidden
    //$("#filter_bar").hide();

    $('#filter_bar').click(showFilterBar);
});

直播：http: //jsbin.com/imevax/15/edit

Answer 3

$(document).ready(function () { 
// Keep filter hidden
//$("#filter_bar").hide();

    $('#filter_bar').click(function(){
       alert('got in here');
       if ($("#filter_bar").is(":hidden")){
          $("#filter_bar").show();
       } 
       else
       {
          $("#filter_bar").hide();
       }
   });

});

你像这样启动 jQuery 事件/函数等：

$('#whatever').whatever(function(params){
  //code here
});