Javascript仅在指定的最后一个节点上侦听事件

时间:2013-07-26 23:02:36

标签: javascript for-loop addeventlistener

所以我正在研究一个简单的gui。问题是只有最后textarea似乎受到脚本的影响。以前所有人都没有反应。 (查看截图)

document.addEventListener("DOMContentLoaded", function (){

// Interactive textareas
var txta = document.getElementsByTagName('textarea');
for (var i = 0; i < txta.length; i++){
    var earse = txta[i].value;
    console.log(earse); // debugging
    txta[i].addEventListener('focus', function(e){
        if (e.target.value === earse) {
            e.target.value = "";
            e.target.addEventListener('blur', function(e){
                if (e.target.value === "") {
                    e.target.value = earse;
                }
            }, false);
        }
    }, false);
    console.log(txta[i]); // debugging
};

}, false);

屏幕截图(http://i.imgur.com/HTsMypB.jpg):screenshot

Html只是一些简单的textarea,并且在html中都指定了一个值。

1 个答案:

答案 0 :(得分:1)

关闭函数内部:

document.addEventListener("DOMContentLoaded", function (){

// Interactive textareas
var txta = document.getElementsByTagName('textarea');
for (var i = 0; i < txta.length; i++){
    var earse = txta[i].value;
    console.log(earse); // debugging
    (function(earse){
            txta[i].addEventListener('focus', function(e){
                    if (e.target.value === earse) {
                            e.target.value = "";
                            e.target.addEventListener('blur', function(e){
                                    if (e.target.value === "") {
                                            e.target.value = earse;
                                    }
                            }, false);
                    }
            }, false);
        })(earse);
    console.log(txta[i]); // debugging
};

}, false);

http://jsfiddle.net/WjV8n/

评论:你需要在内部循环中关闭变量 earse 。因为每一步你都会改变这种变化。