0

更新：我只是回顾了我的问题，我完全明白它没有意义。累的时候不应该在这里问问题。它现在已被重新编写并提供了可能的解决方案

这就是我想要发生的事情：

  1. 当用户单击带有类filter_products的复选框时，将进行 AJAX 调用。
  2. 将返回更新的产品列表。
  3. 更新后的产品列表将替换UL类中的内容更新product_list 后product_list我希望hoverintent事件重新绑定

代码：

<div id="sidebar">
    <input class="filter_products" type="checkbox" name="product_options[1]" value="1">
    <input class="filter_products" type="checkbox" name="product_options[2]" value="2">
</div>

<div id="main">
    <ul id="product_list">
        <li class="product">
            Product name 1
        </li>
        <li class="product">
            Product name 2
        </li>
    <ul>
</div>

<script>
    // Filter products
    $('.filter_products').on('click', function () {
        var inputs = $("input:checked");
        $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) {
            $('#product_list').html(data);
        });
    });

    // Hover product is now wrapped in a function
    $(".product").hoverIntent({over: getAttributtes, out: hideAttributtes});

    function getAttributtes() {
        // Do something
    }

    function hideAttributtes() {
        // Do something
    }
</script>

这可能是解决方案：

// Filter products
$('.filter_products').on('click', function () {
    var inputs = $("input:checked");
    $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) {
        $('#product_list').html(data);

        // Re-initialize hoverintent
        hoverAttributtes();
    });
});

// Hover product
function hoverAttributtes() {
    $(".product").hoverIntent({over: getAttributtes, out: hideAttributtes});
}

function getAttributtes() {
    // Do something
}

function hideAttributtes() {
    // Do something
}

// Initialize hoverintent
hoverAttributtes();
4

1 回答 1

0

如果您想在 ajax 调用后使用此单击，请将此代码放在将使用 ajax 调用更新的 div 之外。我的意思是在 ajax 更新之外的主页中。并在那里单击使用此脚本。

    $(document).on('click','.filter_products', function () {
    var inputs = $("input:checked");
    $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) {
        $('#product_list').html(data);
    });
});
于 2013-04-06T01:16:38.293 回答