Question

我正在开发一个带有rails + jQuery的功能。我从服务器获取一个集合并将其格式化以显示在div中。

我遇到的问题是，当我点击该页面上加载的任何引导选项卡时，所有javascript都停止工作。例如，$(my_element).hide();，$(other_elements).on('click', function() {}等都停止工作。但是，当我刷新页面时，即使使用点击www.mywebsite.com/u/r/l?page=1&collection_status=Attempted等标签的网址，也可以正常使用。

从我的研究中，我了解这与页面的加载方式有关。我的问题是，解决这个问题的最佳方法是什么？我没有从我的研究中找到任何可行的解决方案。

非常感谢任何帮助。

这是一个停止工作的JS之一的例子

   $('.prospect_select_box').on('click', function() {

        var empty = [].filter.call(checkboxes, function(checkbox) {
          return !checkbox.checked
        });

        if (checkboxes.length == empty.length) {
        $('#prospect_select_all').prop('checked', false);
        $('#prospect-left-section').hide();
        }

        if ($(this).prop('checked')) {
            $('#prospect-left-section').show();
        }   else if ( !$(this).prop('checked') && $('#prospect_select_all').prop('checked') ) {
            $('#prospect-left-section').show();
        }
    });

Answer 1

尝试更改点击装订

如下所示：

$(document).on('click', '.prospect_select_box', function() {

    var empty = [].filter.call(checkboxes, function(checkbox) {
      return !checkbox.checked
    });

    if (checkboxes.length == empty.length) {
    $('#prospect_select_all').prop('checked', false);
    $('#prospect-left-section').hide();
    }

    if ($(this).prop('checked')) {
        $('#prospect-left-section').show();
    }   else if ( !$(this).prop('checked') && $('#prospect_select_all').prop('checked') ) {
        $('#prospect-left-section').show();
    }
});

当我们在页面加载后将html元素加载到DOM中时，我们需要添加与document对象的绑定以使用当前可用的DOM元素

单击并加载引导选项卡后，javascript停止工作

1 个答案: