jquery - CSS 样式和 jQuery 事件不适用于 ajax 加载的 HTML

Question

我正在研究 Laravel 框架，用于显示产品列表，每个产品和各自的产品详细信息都嵌入在一个 div 中，因此不同的 div 在页面上显示正确对齐。每个产品 div 都有一个 icheck 复选框来比较两种产品。

同一页面上还有过滤器，如品牌、价格等，每个都与使用 icheck 初始化的复选框相关联。当我单击过滤器复选框时，来自后端的产品使用jQuery Ajax出现在前端。

为创建产品视图创建了不同的刀片，与初始页面加载时显示的刀片相同。该视图由 Laravel 的view()->render()方法渲染并使用方法显示在前端element.html()。

问题是 icheck 和其他按钮的已加载样式和事件不适用于 ajax 加载的 html 内容。

为了让它成功，我必须写一些类似的东西

$(document).on("ifChanged", '.compare_products input[type="checkbox"].minimal-red', function(){
            var test = $(this).val();

            var yourArray = [];
            count = 0;
            $('.compare_products input[type="checkbox"].minimal-red:checked').each(function(){
                yourArray.push({'p_id' : $(this).data('val'), 'prod_name' : $(this).data('prod_name')});

            });
            compare(yourArray, this);
        })

所以我对事件没有任何问题。但是没有应用不同按钮的 CSS 样式（边距、填充等），例如“立即购买”按钮。

那么有人可以建议我解决这个问题吗？

标签： jquerycssajaxlaravel-5.5icheck