问题
jQuery ajax无法触发点击事件
$(document).ready(function () {
var $leftLinks = $("#opt_list a")
// 点击事件不起作用
/*$leftLinks.eq(1).click(initNews());
$leftLinks.eq(3).click(initTopics());*/
// 只有这样才可以
$leftLinks.eq(1).on("click",function () {
initNews();
});
$leftLinks.eq(3).on("click",function () {
initTopics();
});
})
// 初始化新闻列表
function initNews(){
$.ajax({
"url" : "../util/news",
"type" : "GET",
"data" : "opr=list",
"dataType" : "json",
"success" : function (data) {
var $newsList = $("#opt_area>ul").empty();
for (var i = 0; i < data.length;){
$newsList.append("<li>" + data[i].ntitle + "<span> 作者:"
+ data[i].nauther + " "
+ "<a href='../util/news?opr=toModifyNews&nid=' + 'data[i].nid'>修改</a> "
+ "<a href='javascript:;' onclick='return clickdelNew()'>删除</a> "
+ "</span></li>")
if ((++i) % 5 == 0){
$newsList.append("<li class='space'></li>");
}
}
},
"error" : function () {
alert("请求失败")
}
})
}
function initTopics() {
$.ajax({
"url" : "../util/topics",
"type" : "post",
"data" : "opr=list",
"dataType" : "json",
"success" : function (data) {
var $newsList = $("#opt_area>ul").empty();
for (var i = 0; i < data.length;){
$newsList.append("<li>      "+data[i].tname+"      "
+ "<a href='../newspages/topic_modify.jsp?tid="+ data[i].tid + "&" + data[i].tname + "'>修改</a> "
+ "     <a href='../util/topics?opr=del&tid="+data[i].tid+"'>删除</a> </li>")
if ((++i) % 5 == 0){
$newsList.append("<li class='space'></li>");
}
}
}
})
}
// 删除话题
function clickdelTopic(tid) {
if (confirm("此新闻的相关评论也将删除,确定删除吗?")) {
window.location = "../util/topics?opr=del&tid=" + tid;
}
}
// 删除新闻
function clickdelNew(nid) {
if (confirm("此新闻的相关评论也将删除,确定删除吗?")) {
window.location = "../util/news?opr=delete&nid=" + nid;
}
}
当写成
$leftLinks.eq(1).click(initNews());
$leftLinks.eq(3).click(initTopics());
分析
点击时候表面无反应,查看页面请求,发现在加载页面时候两个ajax都被加载触发,但是触发两个ajax函数是绑定在click点击事件的,却都触发了。最终将两个函数封装在function(){};里发现起作用了。如下:
$leftLinks.eq(1).click(function(){
initNews();
});
$leftLinks.eq(3).click(function(){
initTopics();
});
总结
对于触发ajax可以写在类似on,click等事件的function(){[ajax函数]}里触发,而不能直接调用相关函数,避免引起未知原因