[英]jQuery, php and Ajax issue: Can't make dynamic link load dynamic content
IBM网站上有一个很棒的教程,它引导我使用jQuery,PHP和Ajax进行了简单的搜索/结果列表。
我能够使它工作,而且真的很酷。
一个问题。 我希望结果是超链接,并且我无法在结果上运行任何Java脚本。
这是我拥有的脚本(包括本教程中的内容以及ovverride超链接,单击行为所必需的其他脚本):
<script type='text/javascript'>
$(document).ready(function(){
$("#search_results").slideUp();
$("#search_button").click(function(e){
e.preventDefault();
ajax_search();
});
$("#search_term").keyup(function(e){
e.preventDefault();
ajax_search();
});
$("a").click(ClickInterceptor);
});
function ajax_search(){
$("#search_results").show();
var search_val=$("#search_term").val();
$.post("./find.php", {search_term : search_val}, function(data){
if (data.length>0){
$("#search_results").html(data);
}
})
}
function ClickInterceptor(e)
{
window.alert("Hellow World!");
return false;
}
</script>
如果我将以下html放在<body>
标记下:
<a href="test">this will work</a>
这将显示警报窗口。
但是,如果我将结果更改为超链接(可在find.php中找到,本教程中的清单7 ):
$string .= "<a href=\"test\">".$row->name."</a> - ";
这是行不通的。
关于如何解决此问题的任何想法?
click
功能在运行时绑定。 您需要将其更改为实时绑定 。
$("a").live("click", ClickInterceptor);
或者,您也可以在更新搜索结果时将其绑定,方法是将以下内容放在$("#search_results").html(data)
:
$("#search_results a").click(ClickInterceptor);
这个问题实际上很简单, $("a").click(ClickInterceptor);
将仅查找DOM中当前存在的项目。 您需要做的就是将该行更改为此:
$("a").live("click", ClickInterceptor);
我还建议您花些时间阅读有关jQuery的Events / live的更多信息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.