jQuery事件没有触发 [英] jQuery event not firing
问题描述
我有3个文件：
- js_json.js - >我的json代码
- javascript.js - >我的javascript
函数 - index.php
这里的代码为 js_json.js ：
$(function(){
$('#postTitle').change(function(){
var title_id = $("#postTitle").val();
$.ajax({
type:"post",
url:"proses.php",
data:"title_id=" + title_id,
dataType:"json",
success:function(data){
body="";
//$.each(data, function(i,n){
//body = n['body'];
//});
body += "<a href=\"javascript:void(0);\" id=\"pesan\" name="pesan" onClick=\"\">Hola Test</a>";
$(".postBody").empty();
$(".postBody").append(body);
},
error:function(data){
$(".postBody").empty();
$(".postBody").append("NO Post Selected.");
}
});
return false;
});
});
此处我的 javascript.js 代码：
$(function (){
$("a[name=pesan]").click(function (){
alert("holalalalalal.....!");
});
});
此处 index.php 代码：
//some code
<body>
<a href="javascript:void(0);" id="pesan" name="pesan">Hola Test 1</a>
Posts : <br />
<select name="title" id="postTitle">
<option value="">Select Post...</option>
<?php
$sql = "SELECT id, title FROM posts ORDER BY title";
$query = mysql_query($sql) or die(mysql_error());
while($rows = mysql_fetch_array($query)){
print('<option value="' . $rows['id'] . '">' . $rows['title'] . '</option>');
}
?>
</select>
<br />
Body : <br />
<div class="postBody">
Will show the body of post.
</div>
</body>
</html>
我的问题是：
我点击Hola Test 1链接，它可以正常显示消息。问题是，在我单击选择选项后，出现链接Hola Test，然后我点击（Hola Test）链接，消息没有出现，并且firebug中没有错误......
When I click the link "Hola Test 1", it works and the message appears. The problem is, after I click the select option, and the link "Hola Test" appears, and then I click that ("Hola Test") link, the message does not appear and there are no errors in firebug...
有人可以向我解释为什么......？谢谢......
Can somebody explain to me why...? Thank's...
推荐答案
click（）只会绑定事件对于点击时页面中存在的元素（对于没有选择器的 on（）也是如此） ， bind（），以及快捷方式组中用于绑定的所有其他方法; keydown（）， change（）等。）
click() will only bind the event for elements that exist in the page at the time click is called (the same goes for on() without a selector, bind(), and all the other methods in the shortcut-group for bind; keydown(), change() etc. ).
因为你的其他元素后来通过AJAX 添加 em>，处理程序没有绑定它。
Because your other element is getting added via AJAX some time later, the handler isn't bound for it.
使用 .on（） 使用选择器，它会将事件绑定到选择器匹配的所有当前和未来元素。
Use .on() with a selector instead, which will bind the event to all current and future elements matched by the selector.
$(function (){
$(document).on('click', 'a[name=pesan]', function () {
alert("holalalalalal.....!");
});
});
因为 on（）是在jQuery中引入的1.7，如果您使用的是早期版本的jQuery（就像提出此问题时存在的那些版本），您可以使用 live（） 或 委托（） 而不是on;
Since on() was introduced in jQuery 1.7, if you're using earlier versions of jQuery (like those that existed when this question was asked), you can use live() or delegate() instead of on;
$(function (){
$('a[name=pesan]').live('click', function () {
alert("holalalalalal.....!");
});
});
这篇关于jQuery事件没有触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
