Question

我有一张表格。我包括Dojo。一切正常。我使用Dojo根据用户输入更改输入元素的类，值和属性（类似于验证）。

问题是，因为IE，我需要创建一个新的输入元素（我知道），如果我想将输入的'type'从'text'更改为'password'。

一旦我创建了这个元素（它具有所有相同的属性和相同的id），就像它替换它的元素一样，我的Dojo函数如...

dojo.query("#password2")
    .connect("onclick",function(){
        // if password2 is equal to the default text
        if( this.value == "Confirm your password" ){
            this.value = "";
            UpdateType( this );    // this is the function that dynamically creates the new input element to have a type of 'password' 
        }
        dojo.query("#list_password2").removeClass("error");
    });

...不再适用于新创建的元素。我以前遇到过这个问题并且习惯使用jQuery并且有一个livequery插件可以将事件重新分配给元素。是否有Dojo的插件或本机功能，我不知道这个？

Answer 1

很奇怪谷歌的第一个结果是这个答案，而且它没有提供最新的回复。

无论如何，对于那些需要将事件附加到动态创建元素的人来说，自dojo 1.7以来，可以使用事件委托。一个简单的例子是：

require(["dojo/on", "dojo/query"], function(on) { 
    on(parentElement, '.child-selector:click', function(e) {
        alert('clicked');
    });
});

我相信这段代码非常明显，所以我不会详细介绍。但是，有关事件授权的一些值得注意的事项：

请注意，事件委派仅适用于冒泡的事件。最 DOM事件会冒泡，但也有一些例外。 mouseenter 并且mouseleave个事件不会冒泡，但mouseover和mouseout是冒泡的同行。 focus和blur事件不会冒泡，但是dojo / on将focusin和focusout规范化为冒泡等价物。此外，scroll事件不会冒泡。

当然，不要忘记首先加载dojo/query ...

请注意，必须加载dojo / query才能使事件委派工作。

Read more了解更多说明......希望有所帮助！

Answer 2

首先，最初创建一些额外的字段会不会更容易，然后根据用户的选择显示/隐藏它们？好吧，Dojo中没有livequery，但使用Dojo的connect将事件处理程序绑定到给定的id而不是节点并不太困难。您只需要在节点层次结构中向上移动，捕获所有冒泡的事件，并根据id过滤右侧节点。例如，如果您的表单的ID为login，则可以：

dojo.query( '#login' ).connect( 'click', function( evt ) {
    console.log( evt );
    if( evt.target.id == 'password2' ) {
        console.log('success');
    }
});

在这里查看jrburke的答案：Can dojo access the function assosiated with a HTML elements Event?

Answer 3

我相信Dojo行为是您想要使用的机制。它将使用一些相关的操作（“行为”）注册dojo.query选择器。它将跟踪DOM的更改并将行为重新应用于新匹配。

此链接应该有用：http://dojocampus.org/content/2008/03/26/cleaning-your-markup-with-dojobehavior/

此外，您可能需要考虑使用基于类的选择样式而不是基于id的选择样式。根据我的经验，删除然后向具有相同id的DOM添加节点在某些浏览器中是有问题的。

Dojo将事件附加到动态创建的元素

3 个答案: