Question

我在脚本上使用Prototype来检测Div下的所有选择标签，然后在每个上添加一个事件/观察者！

以下是找到我需要的元素的代码：

Event.observe(window, 'load', function() {
  var tab=$("product-options-wrapper").descendants();
  var attCode=[];
  var j=0;

  for (i=0;i<tab.length;i++) {
    if (tab [i].tagName =="SELECT") {
      attCode[j++]=tab[i].id
    }
  }
});

我有我需要的所有ID。如何为每个人添加一个观察者（在变化中）？

$(id).on("change", function(event) {
  alert(id+"__"+$(id).value);
});

感谢您的帮助。

Answer 1

Prototype支持开箱即用的事件委托。 Event.on采用可选的第二选择器参数。所以在你的情况下：

$("product-options-wrapper").on('click', 'select', function(event, element) {

  // This callback will only get fired if you've clicked on a select element that's a descendant of #product-options-wrapper
  // 'element' is the item that matched the second selector parameter, in our case, the select.

  ....

});

该参数可以是任何CSS选择器字符串：

$('my-element').on('click', '.some-class', function(event, element) { ... });

也可以查看Element.select。这会将原始问题中的代码压缩到基本上一行：

$("product-options-wrapper").select('select');

这个似乎有点混乱，因为你的选择器字符串是'select'（你想要#product-options-wrapper下的所有SELECT元素）。你也可以这样做：

$$('#product-options-wrapper select');

这两个都返回一组匹配的元素。

HTH

Answer 2

应该这样做。如果您需要更多帮助，请发布您的HTML或更好jsfiddle。

$(function(){
    $('#product-options-wrapper select').on("change", function(e) {
       alert(id+"__"+$(this).val());
    });
});

我猜你忘记了product-options-wrapper开头的.来表明它是一个类？或者它真的是一个标签？

Answer 3

您只需要div上的点击处理程序（换句话说，使用event delegation）

var tab = $("product-options-wrapper");
tab.on('click',function(e){
  e = e || event;
  if ( /^select$/i.test((e.target || e.srcElement || {}).tagName) ){
    //do stuff
  }
});

如何为我在页面上找到的每个元素添加事件观察器？

3 个答案: