Question

我在JQuery中遇到.bind()和.unbind()的奇怪行为，即使我的情况看似与JQuery网站上给出的示例相同。在这种情况下，bind / unbind应用于JQuery选项卡（其中之一）。单击选项卡时，它会通过ajax加载控制器操作。

# show.html.erb:
$(document).ready( function(){
    var projectNav = function(){
        $("#tabs-project .loadingDiv").show();
        $.ajax({ url: "<%= url_for(params.except(:action).merge(:action => 'show_project')) %>", dataType: 'script' })
    };
    $("#projectMenuButton").bind('click', projectNav);
});

# show_project.js.erb
$("#tabs-project .loadingDiv").remove();
$("#tabs-project").append('<%= escape_javascript(render :partial => "profiles/project")%>')
$("#projectMenuButton").unbind('click', projectNav);

.unbind()部分不能正常工作 - 再次单击菜单按钮会重新加载部分。

当我将现有的unbind更改为$("#projectMenuButton").unbind('click');时，它取消绑定所有内容，包括选项卡的主要功能（将视图切换到右边的div）。

Answer 1

您有范围问题... projectNav仅在$(document).ready的范围内定义，因此在传递到unbind时未定义。解决方案：

# show.html.erb:
var projectNav = function(){
        $("#tabs-project .loadingDiv").show();
        $.ajax({ url: "<%= url_for(params.except(:action).merge(:action => 'show_project')) %>", dataType: 'script' })
};
$(document).ready( function(){
    $("#projectMenuButton").bind('click', projectNav);
});

# show_project.js.erb
$("#tabs-project .loadingDiv").remove();
$("#tabs-project").append('<%= escape_javascript(render :partial => "profiles/project")%>')
$("#projectMenuButton").unbind('click', projectNav);

JQuery .bind（）/ .unbind（）问题

1 个答案: