我正在使用 JQuery (1.10.1) 运行 AJAX 调用并将内容插入 DIV。对 ajax DIV 中的 li 标记的任何单击都应触发警报以及 AJAX 方法。第一次运行它可以工作，但随后的调用失败并且我没有收到警报。
我认为我应该在成功的 AJAX 调用后绑定 ajax DIV，但我不确定。我已经尝试过.on 方法，然后是.bind，但是没有详细的JQuery 理解，我不能再进一步了。我可能忽略了一些更基本的东西。
测试1.php：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#ajax li').click(function() {
alert("Clicked");
$.ajax({
type: "post",
cache: false,
success: function(data){
$('#ajax').load("test2.php");
},
error:function(){
$("#ajax").html('Submission Error');
}
});
});
});
</script>
</head>
<body>
<div id='ajax'>
<ul>
<li>Example list item #1</li>
<li>Example list item #2</li>
<li>Example list item #3</li>
</ul>
</div><!-- Close ajax DIV -->
</body>
</html>
test2.php
<ul>
<li data-val='100009'>Red</li>
<li data-val='100008'>Blue</li>
<li data-val='100007'>Green</li>
</ul>