添加点击事件动态添加按钮到剑道窗口内容

问题描述：

我有剑道窗口和im动态添加内容到剑道窗口。内容有一个按钮，我想将点击事件附加到该按钮。 jQuery是能够找到从内容的按钮，连接单击事件然而单击事件永远不会被解雇添加点击事件动态添加按钮到剑道窗口内容

的Html

<div id="example"> 
    <div id="window">  
    </div> 
</div>

JQuery的

  $(document).ready(function() {     
        // in reality this contnet will be returned from ajax call 
        var dynamicContent ="<div><button id='btn' type='button'>Click Me</button></div>" 
        var myWindow = $("#window") 
        var button = $(dynamicContent).find("#btn"); 

        // show number of buttons found.      
        alert("found " + button.length + " button") 

        // attach click event to button 
             button.click(function(){ 
         alert("this is test");      
        }) 

        myWindow.kendoWindow({ 
         width: "600px", 
         height:"200px", 
         title: "My Window" 
        }).data("kendoWindow").center().open().content(dynamicContent); 
       });

在您将其插入到DOM之前，您选择了尚未创建的jQuery按钮。我不知道kendo api，但是我会寻找一个当内容发生变化时调用的事件，然后以回调的方式执行按钮代码。 – Strernd

答

您需要更改：

button.click(function(){ 
    alert("this is test");      
})

到

$('#window').on('click', 'button', function(){ 
    alert("this is test");      
})

如你所提到的元件是动态创建的，所以它不是浏览器的一部分的DOM结构，并且因此不能与jQuery进行选择。使用上面的代码，jQuery会监听#window元素中dom结构的任何更改，以便您可以选择任何动态创建的元素。

添加点击事件动态添加按钮到剑道窗口内容

相关推荐