现有 onclick 事件的 Javascript IE8 包装器

Question

我必须在原始 onclick 事件触发之前调用另一个函数，在找到以下解决方案之前我尝试了很多不同的路径:

function bindEnableFieldToAllLinks() {
    var links = document.getElementsByTagName('a');
    for (var i = 0; i < links.length; i++) {
        var link = links[i];
        var onclick = link.getAttribute('onclick');
        link.onclick = new Function("if(linkClickHandler()){"+onclick+"}");
        console.log(link.getAttribute('onclick'));
    }
}

这在 Firefox 和 Chrome 中有效，但 IE8 表现得很奇怪，似乎 onclick 变量中的函数没有执行。 我已经添加了在 if 语句为 true 后触发的 console.log 消息，如果我打印出 onclick 属性，我会得到以下消息:

LOG: function anonymous() {
if(linkClickHandler()){function onclick()
{
if(typeof jsfcljs == 'function'){jsfcljs(document.getElementById('hoedanigheidForm'),      {'hoedanigheidForm:j_id_jsp_443872799_27':'hoedanigheidForm:j_id_jsp_443872799_27'},'');}return false
}}
}

看来该函数位于链接的 onclick 上，并且旧的 onclick 函数也位于其上。

有人可以帮我解决这个问题吗？

Answer 1

假设您在 HTMLElement 上有一个 onclick 属性..

<span id="foo" onclick="bar"></span>

现在，

var node = document.getElementById('foo');
node.getAttribute('onclick'); // String "bar"
node.onclick; // function onclick(event) {bar}

后者看起来对您想要实现的目标更有用，因为使用它仍然具有其原始范围，并且您不必重新评估代码与函数。

function bindEnableFieldToAllLinks() {
    var links = document.getElementsByTagName('a'),
        i;
    for (i = 0; i < links.length; i++) function (link, click) { // scope these
        link.onclick = function () { // this function literal has access to
            if (linkClickHandler())  // variables in scope so you can re-
                return click.apply(this, arguments); // invoke in context
        };
    }(links[i], links[i].onclick); // pass link and function to scope
}

<小时/>

此外，在 onclick 属性内设置命名函数(即作为字符串)不会实现任何目的； the function doesn't invoke or even enter the global namespace因为它被包裹了。
设置匿名的情况会更糟，并且当 onclick 尝试执行时会抛出 SyntaxError。