原型在更改事件问题上着火

Question

这是我的js文件内容：

window.onload = function() {
    obj = document.getElementById("_accountwebsite_id");
    Event.observe(obj, 'change', function () {
        alert('hi');
    });
}

我想为我的下拉菜单触发更改事件：_accountwebsite_id。它在这个文件之前加载的原型库。我在控制台中没有错误。我哪里错了？谢谢

Answer 1

你在这里做了很多原型为你做的额外工作。首先，设置文档的 onload 方法不仅是真正的老派，它还会破坏任何先前设置的对该事件的观察者。

$(document).observe('dom:loaded', function( ... ){...});

...是将一个（或多个）事件侦听器注册到文档加载事件的现代方法。

接下来，您将在此处使用 getElementById，这会起作用，但在某些浏览器中 return 不是原型扩展对象。

$('element-id');

...如果您的浏览器未能尊重原型继承的各个方面，将获取元素引用并扩展它。

最后，通过使用延迟观察器，整个事情可以变得更简单、更可靠。想象一下，如果你的界面 DOM 被 Ajax 更新了——这会让你的观察者错过这个 select 元素触发的事件，因为它没有引用同一个 (===)元素，即使 ID 匹配。

$(document).on('change', '#_accountwebsite_id', function(evt, elm){
  alert(elm.inspect());
});

此观察者将响应具有正确 ID 的元素上的任何更改事件，即使它是在观察者向文档注册之后添加的。

原型在更改事件问题上着火

Prototype fire on change event issue

javascript

prototypejs