Question

我正在使用wordpress网站，并在点击链接时尝试加载图片（跟踪像素）。我有这个代码，但似乎没有加载。我错过了什么吗？在此先感谢您的帮助。

HTML

<a class="button" target="_blank" title="" href="/rd/credit-check.php" id="ccBtn"><span class="fusion-button-text">GET YOUR FREE CREDIT SCORES NOW!</span></a>
 <div id="pixel"></div>

JS

jQuery("#ccBtn").click(function(){
jQuery("#pixel").html("<img src='http://imageurl.com/img.png' alt='itworks' />");
});

Answer 1

这可能是一个时间问题。浏览器必须比图像有时间加载更快地获取链接。

我会将jQuery更改为以下内容：

jQuery(document).ready(function($){
    $('#ccBtn').on('click', function(e){
        e.preventDefault(); //stop click
        var $this = $(this);
        $this.off('click'); //remove this function when click on link
        $("#pixel").html("<img src='http://imageurl.com/img.png' alt='itworks' />"); //add image
        setTimeout(function(){$this.trigger('click')}, 500); //click on this link again.
    });
});

这会在加载像素时停止链接触发半秒。

Answer 2

如果它是像其他成员提到的图像加载时间问题，请允许我第一个提到David DeSandro称为ImagesLoaded的插件。

一旦在您的站点中实现，您可以在任何时间点让它响应任何容器完全加载其图像，然后完成回调功能。

然后你可以在@nicael

这里给出答案

喜欢这样......

$(document).ready(function{
    $("#someDiv").imagesLoaded(function() {
        $("#ccBtn").click(function(){
            $("#pixel").html("<img src='http://imageurl.com/img.png' alt='itworks' />");
        });
    });
});

这将允许您在尝试将事件侦听器绑定到它之前加载所有图像。

按钮点击加载div中的图像 - Wordpress

2 个答案: