为什么我对 <img>“onload”事件处理程序的使用偶尔工作

Why is my use of the <img> 'onload' event handler working sporadically?

本文关键字：程序 事件处理 工作 偶尔 img 为什么 onload      更新时间：2023-09-26

下面的代码，工作...有时，但我不知道为什么它不能一直工作。

我正在尝试确定有多少人按下不同网页上的"立即购买"PayPal按钮。

目前，网站上的每个页面都从唯一位置获取一个 43 字节的 1x1 gif(感谢 mod_rewrite (，这在 Apache 访问日志中很容易被 grep'able。 我的想法是，如果我可以使用javascript更改该图像的URL，我可以跟踪访问日志中的单击，同时仍然使浏览器的前进和后退按钮正常工作。

下面的代码(Override_Form_OnClick()(在页面上查找一个表单(只有一个(，并将处理程序(my_shopping()(附加到表单的onclick处理程序。

然后，my_shopping()处理程序更新名为 my_stats 的图像资源(同样，只有一个(，将表单元素的 submit 函数附加到图像的onload处理程序，然后返回 false，以便在加载新图像之前不会提交表单。

这就是意图，但它并不总是在访问日志中记录新映像。 当然，我只是使用开发工具在 Chrome 中对其进行了测试，所以也许这是其他浏览器的问题？

<script>
function my_shopping(onload_handler, shopping_tag) {
    'use strict';
    var my_img_elements = document.getElementsByName('my_stats'),
        my_img_url,
        i,
        len;
    len = my_img_elements.length;
    if (len > 1) {
        alert("Multiple my_stats elemetns on page: only expected 1.");
    }
    for (i = 0; i < len; i += 1) {
        my_img_url = my_img_elements[i].src;
        my_img_url = my_img_url.replace(".gif", "." + shopping_tag + ".gif");
        my_img_elements[i].onload = onload_handler;
        my_img_elements[i].src = my_img_url;
    }
    return false;
}
function Override_Form_OnClick() {
    'use strict';
    var elements = document.getElementsByTagName('form'),
        element,
        i,
        len;
    len = elements.length;
    if (len > 1) {
        alert("Multiple 'form' elements on page: only expected 1.");
    }
    for (i = 0; i < len; i += 1) {
        element = elements[i];
        element.onclick = function () { my_shopping(element.submit, "shopping.PayPal") };
    }
    return true;
}
Override_Form_OnClick();
</script>

该网站的政策强烈倾向于仅使用javascript。

也许这会起作用。让我知道。

for(var i=0,l=my_img_elements.length; i<l; i++){
  var mi = my_img_elements[i], ni = new Image;
  ni.src = mi.src = mi.src.replace(".gif", "." + shopping_tag + ".gif");
  ni.onload = onload_handler;
}
相关文章：