如何通过在创建事件的javascript中定义的处理程序来处理事件？

我打开一个myApp.js html页面包含这样的：如何通过在创建事件的javascript中定义的处理程序来处理事件？

<html> 
<body> 
...... 
<div id="dynamicForm"></div> 
...... 
<script type="text/javascript" src="myPath/myApp.js"></script> 
...... 
</body> 
</html>

，然后我想在加载该html页面上myApp.js定义的被动态形式（“#dynamicForm”）时， myApp.js有这样的句子：

..... 
//load the form on the html page 
$('#dynamicForm').html(createDynamicForm()).show();   
..... 
//the function creating the form 
function createDynamicForm(){ 
    var jqForm=$('<form id="dynamicFormId">' 
    ...... 
    + '<button id="btn">OK</button>' 
    + '</form>'); 
    $('body').append(jqForm); 
    return jqForm; 
} 
..... 
//click the button on the form to trigger the alert box 
("#btn").click(function(){ 
    alert("you click the button"); 
});

我可以加载HTML页面的形式，但是当我点击这个动态加载表格上的“确定”按钮，警报不会弹出，显然这是因为myApp.js在动态表单创建之前加载了html页面，“click”事件不能由myApp.js中定义的处理程序处理，电子表格。我该如何解决这个问题？

来源

2012-06-29 cnherald

你尽力了#btn动态，所以你需要一个委托的事件处理程序，并为此目的，你应该使用.on()。

的 .on()为代表事件

$('body').on('click', '#btn', function(){ 
    alert("you click the button"); 
});

语法如下：

$(staticElement).on(eventName, target, handlerFunction);

这里，staticElement点到属于DOM在页面加载即其不是动态的元件。

来源

2012-06-29 11:40:24 thecodeparadox

+1使用最近的静态元素和链接文档。 – Nope

谢谢codeparadox这个解决方案就像一个魅力！我也想知道这个问题是否已在之前的计算器上得到解答？在谷歌搜索解决方案时应该包括哪些关键词？ – cnherald

如何通过在创建事件的javascript中定义的处理程序来处理事件？

回答

相关问题