Question

此代码实际上显示隐藏的内容，并在执行该功能时重新分配新按钮。

我遇到的问题是，当选择分页或选择/使用价格滑块时，该功能不会再次准备好。

我的jQuery .on（）代码在小提琴（http://jsfiddle.net/hslincoln/Fgx7D/4/）中运行良好，但在测试环境（http://jmldirect.uat.venda.com/uk/offers/icat/7offers）中运行不正确：

HTML：

<img class="brands-toggle" id="#brandresults" src="http://jmldirect.uat.venda.com/content/ebiz/shop/resources/images/+.png">

jQuery的：

jQuery(".brands-toggle").bind( "click", function() {
    var collapse_content_selector = jQuery(this).attr('id');
    var toggle_switch = jQuery(this);
    jQuery(collapse_content_selector).toggle(function () {
        if (jQuery(this).css('display') == 'none') {
            toggle_switch.attr("src", toggle_switch.attr("src").replace("http://jmldirect.uat.venda.com/content/ebiz/shop/resources/images/-.png","http://jmldirect.uat.venda.com/content/ebiz/shop/resources/images/+.png"));
        } else {
            toggle_switch.attr("src", toggle_switch.attr("src").replace("http://jmldirect.uat.venda.com/content/ebiz/shop/resources/images/+.png", "http://jmldirect.uat.venda.com/content/ebiz/shop/resources/images/-.png"));
        }
    });
});

有什么建议吗？

修改更改语法以使用早期版本的jQuery - 使用.bind（）而不是.on（）。

在AJAX调用之后它还没有重新加载的问题。

Answer 1

这被清除了.delegate（）是一个更合适的方法：

<强> jQuery的：

    // 1.1 Brands toggle

jQuery(".wpShadow").delegate( ".boxContent #brand", "click", function(e) {
        e.preventDefault();
    var collapse_content_selector = jQuery('#brandresults');
    var toggle_switch = jQuery(this).find('img');
        if (jQuery(collapse_content_selector).css('display') == 'none') {
            toggle_switch.attr("src", toggle_switch.attr("src").replace("bkg-dropdown.png","bkg-dropdown-minus.png"));
        } else {
            toggle_switch.attr("src", toggle_switch.attr("src").replace("bkg-dropdown-minus.png", "bkg-dropdown.png"));
        }   
    jQuery(collapse_content_selector).toggle();
});

Answer 2

尝试使用$('body').on代替$(document)/on

.on（）jQuery函数在通过AJAX更新页面后无法正常工作

2 个答案: