动态分配事件监听器答案

【问题标题】：Dynamically Assign Event Listseners动态分配事件监听器
【发布时间】：2013-03-13 19:18:53
【问题描述】：

在我的 Titanium 应用程序中，我有一个包含 6 个相同字段的表单，唯一的区别是它们的标题。我没有重复代码（不好的做法，更多的工作等），而是使用了一个 for 循环来动态创建每个字段，其中包含 2 个标签和一个视图：

//Required info
var startht = 30;
var sz = 40;
var width = '90%';
var labelgrp1 = new Array('Field 1', 'Field 2', 'Field 3', 'Field 4', 'Field 5', 'Field 6');
var viewbg = '#D4D4D4';

//For the first group of labels
for(var i=0; i<labelgrp1.length; i++) {
var view = Titanium.UI.createView({
   borderColor:'#000',
   backgroundColor:viewbg,
   touchEnabled: true,
   width:width, height:40,
   top: startht + i * (sz - 1)
});

var label = Ti.UI.createLabel({
  color: '#303030',
  font: { fontSize:16 },
  shadowColor: '#aaa',
  shadowOffset: {x:1, y:1},
  text: labelgrp1[i],
  left:10,
  width: 'auto', height: 'auto'
});

var symbol = Ti.UI.createLabel({
  color: '#303030',
  font: { fontSize:14 },
  right:10,
  text: '>',
  width: 'auto', height: 'auto'
});

view.add(label);
view.add(symbol);
win.add(view);
}

我尝试将其添加到底部：

view.addEventListener('focus',function(e){
    Ti.API.info("Clicked on " + label.text);
});

但无济于事。有没有办法动态创建事件监听器，或者我需要为每个字段有一个单独的视图对象，以便它可以直接绑定到事件监听器？

【问题讨论】：

标签： javascript events dynamic titanium

【解决方案1】：

Ti.UI.View 没有焦点事件。如果你想列出另一个事件，比如click，你可以像这样将事件监听器添加到for循环中的每个视图：

(function(v, msg){
    v.addEventListener('click',function(e){
        Ti.API.info("Clicked on " + msg);
    });
})(view, label.txt);

如果你要添加text fields，它确实有focus 事件，你可以用同样的方式添加监听器。

【讨论】：

我不打算添加文本字段，但这看起来很棒。我不能说我明白这里发生了什么。您介意解释一下函数后面的 (view, label.text) 是什么，或者它是如何工作的？
这是一个匿名的自调用（或自调用）函数。我们将 view 和 label.text 传递给它，它们被称为 v 和 msg 作为函数的参数。 view 变量随着 for 循环的每次迭代而改变，通过这样做，我们将视图锁定为 v，它不会被覆盖。有一些更好的解释here和here。

【解决方案2】：

焦点和模糊事件不会冒泡，因此在这种情况下，您需要监听每个单独的字段。

您可以使用鼠标事件绕过它，但这不是一个很好的解决方案：http://www.quirksmode.org/blog/archives/2008/04/delegating_the.html

【讨论】：