0

我的剧本显然有一个根本性的缺陷，尽管我看不出它是什么。

我正在尝试从“选择器”更改列表中的元素。

该脚本在执行一次时运行良好，但随着每次新的执行，它会增加它在每个事件上运行的时间。

在这里更容易理解我在实践中的意思：http: //jsfiddle.net/Zbdt3/1/

$$('.edit').each(function(el) {
    el.addEvent('click',function() {
        $$('#picker span').each(function(im) {
            im.addEvent('dblclick',function() {
                el.getParent().getElement('p').set('text',im.get('text'));
                console.log(im.get('text'));
            });
        });
    });
});

<ul>
<li><p>X</p><span class="edit">edit</span></li>
<li><p>Y</p><span class="edit">edit</span></li>
<li><p>Z</p><span class="edit">edit</span></li>
</ul>

<div id="picker">
<span>A</span>
<span>B</span>
<span>C</span>
</div>
4

3 回答 3

2

您首先遍历所有.edit元素并将事件附加到每个元素。

在每个元素的事件处理程序中，您遍历每个#picker span元素并为每个元素附加另一个事件处理程序。

这样，每次.edit触发元素的事件处理程序时，您都会为元素附加额外的事件处理程序，#picker span并且它们会堆积起来。当事件 on#picker span被触发时，所有的地狱都崩溃了......

于 2012-08-16T06:58:05.353 回答
2

#picked span因为每次点击都会添加新的事件监听器.edit。您应该单独添加它们。

var activeEl;

$$('.edit').each(function(el) {
    el.addEvent('click',function() {
        $('picker').setStyles({
            'display':'block'
        });
        activeEl = el;             
    });
});

$$('#picker span').each(function(im) {
    im.addEvent('dblclick',function() {        
        activeEl.getParent().getElement('p').set('text',im.get('text'));          
        console.log(im.get('text'));
        $('picker').setStyle('display','none');
    });
});

​ 这里是更新的示例http://jsfiddle.net/hQqh6/

于 2012-08-16T07:09:27.823 回答
0

因为您正在选择，$$('.edit')并且此选择器将返回集合（您有带有的3元素class="edit"），您正在通过它.each(function(el) ...为每个元素进行分配el.addEvent('click',function() ...（单击事件）。在此事件处理程序中，每次.edit触发事件时，您都在为#picker span. 结果，触发了多个事件，并且“某处”失败了。

注意：正如@Tadeck.each()提到的，通过（以一对一的方式）顺序分配事件不是很有效。可以通过选择器来完成。

于 2012-08-16T06:56:39.907 回答