Question

我想使用javascript DOM

为下面的代码创建一个克隆

 var summaryDiv = __createElement("div","sDiv","sDiv"+j);
        summaryDiv.onmouseover = function() {this.setAttribute("style","text-decoration:underline;cursor:pointer;");}
        summaryDiv.onmouseout = function() {this.setAttribute("style","text-decoration:none;");}
        if(browser.isIE) {
            summaryDiv.onclick = new Function("__fc.show_tooltip("+j+",'view_month')");
    } else {
            summaryDiv.setAttribute("onclick", "__fc.show_tooltip("+j+",'view_month',event)");
        }
   someobj.appendChild(summaryDiv);

我正在使用创建节点的obj = summaryDiv.cloneNode（true）。但是在Internet Explorer的情况下onclick事件并没有起火。任何人都可以帮助我吗？

Answer 1

this.setAttribute("style","text-decoration:underline

不要使用setAttribute，对于很多情况（包括这个），它在IE＆lt; 8中不起作用，并且HTML / CSS-DOM属性更具可读性：this.style.textDecoration= 'underline';。

（现在你可能想要使用CSS :hover规则而不是JS悬停突出显示。只有IE6才能使用仲裁悬停不起作用;最后剩下的IE6用户通常可以没有最闪亮的东西只要它仍然有效。他们可能习惯于现在看到破碎的网站......）

    if(browser.isIE) {
        summaryDiv.onclick = new Function("__fc.show_tooltip("+j+",'view_month')");
    } else {
        summaryDiv.setAttribute("onclick", "__fc.show_tooltip("+j+",'view_month',event)");
    }

不需要令人讨厌的旧浏览器嗅探（避免！），因为第一个将在所有浏览器中工作。但是，从字符串创建函数真的很难看。您可以改为使用函数文字：

summaryDiv.onclick= function() {
    __fc.show_tooltip(j, 'view_month');
};

但是，如果您在循环中执行此操作（超过j？），则可能需要Closure Loop Problem。您可以使用另一个闭包来解决这个问题，但ECMAScript Fifth Edition的Function#bind更清晰：

summaryDiv.onclick= __fc.show_tooltip.bind(__fc, j, 'view_month');

Adding bind to browsers that don't yet support it.

但onclick事件[on clone]在Internet Explorer的情况下不会起火。

是的，在克隆时不要复制事件处理程序是正常的。（实际上，通常IE错误地克隆了通过attachEvent添加的侦听器，这就是问题，所以这是相反的。）

如果您想在克隆后保留事件处理，则必须手动执行：

newClone.onclick= oldNode.onclick;

使用Javascript DOM克隆节点

1 个答案: