[英]Loading javascript after AJAX load
I have a woocommerce site that uses light-box products with AJAX filters. 我有一个woocommerce网站,该网站使用具有AJAX过滤器的灯箱产品。 To access the light box a quick-view button appears when you hover over the product. 将鼠标悬停在产品上时,要访问灯箱,将显示一个快速查看按钮。
When I load an AJAX filter the light-box quick-view button is no longer clickable. 当我加载AJAX过滤器时,不再可以点击灯箱快速查看按钮。 I need to add the code to the button after the AJAX load. 我需要在加载AJAX之后将代码添加到按钮。 Below is the function that the theme uses. 以下是主题使用的功能。
85: function(t, e) {
"use strict";
Flatsome.behavior("quick-view", {
attach: function(t) {
jQuery(".quick-view", t).each(function(t, e) {
jQuery(e).hasClass("quick-view-added") || (jQuery(e).click(function(t) {
if ("" != jQuery(this).attr("data-prod")) {
jQuery(this).parent().parent().addClass("processing");
var e = jQuery(this).attr("data-prod"),
i = {
action: "flatsome_quickview",
product: e
};
jQuery.post(flatsomeVars.ajaxurl, i, function(t) {
jQuery(".processing").removeClass("processing"), jQuery.magnificPopup.open({
removalDelay: 300,
closeBtnInside: !0,
autoFocusLast: !1,
items: {
src: '<div class="product-lightbox lightbox-content">' + t + "</div>",
type: "inline"
}
}), setTimeout(function() {
jQuery(".product-lightbox").imagesLoaded(function() {
jQuery(".product-lightbox .slider").flickity({
cellAlign: "left",
wrapAround: !0,
autoPlay: !1,
prevNextButtons: !0,
adaptiveHeight: !0,
imagesLoaded: !0,
dragThreshold: 15
})
})
}, 300), jQuery(".product-lightbox form").hasClass("variations_form") && jQuery(".product-lightbox form.variations_form").wc_variation_form(), jQuery(".product-lightbox form.variations_form").on("show_variation", function(t, e) {
e.image.src ? (jQuery(".product-lightbox .product-gallery-slider .slide.first img").attr("src", e.image.src).attr("srcset", ""), jQuery(".product-lightbox .product-gallery-slider .slide.first a").attr("href", e.image_link), jQuery(".product-lightbox .product-gallery-slider").flickity("select", 0)) : e.image_src && (jQuery(".product-lightbox .product-gallery-slider .slide.first img").attr("src", e.image_src).attr("srcset", ""), jQuery(".product-lightbox .product-gallery-slider .slide.first a").attr("href", e.image_link), jQuery(".product-lightbox .product-gallery-slider").flickity("select", 0))
}), jQuery(".product-lightbox .quantity").addQty()
}), t.preventDefault()
}
}), jQuery(e).addClass("quick-view-added"))
})
}
})
}
If you can edit the theme, write the code directly into the success callback: 如果可以编辑主题,请将代码直接写入成功回调中:
jQuery.post(flatsomeVars.ajaxurl, i, function(t) {
// Code you want to run
// Other code. i.e. jQuery(".processing").removeClass ... etc.
});
Or define the function and call it inside your success() callback. 或定义函数并在您的success()回调内部调用它。
var myFunction = function() {
// Code to run after success
}
jQuery.post(flatsomeVars.ajaxurl, i, function(t) {
myFunction();
// Other code
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.