本人用ajax做一个显示新闻列表的页面,代码:
$(function() {
//调用下面的方法
})
var tbody = "";
$.ajax({
type: "POST",
dataType: "json",
url: "NewsList.ashx",
data: "pageindex=" + (pageIndex+1),
success: function(json) {
$("#productTable tr:gt(0)").remove();
$.each(json, function(i, n) {
var trs = "";
trs += "<tr><td style='text-align:center'><a href=\"#\" class=\"info2\">" + n.Title +
"</a></td><td style='text-align:center'>" + n.ReadTimes +
"</td><td style='text-align:center'>" + n.time + "</td></tr>";
tbody += trs;
});
$("#productTable").append(tbody);
//奇偶行颜色不同
$("#productTable tr:gt(0):odd").attr("class", "odd");
$("#productTable tr:gt(0):even").attr("class", "enen");
}
});
实现鼠标移到新闻的标题上显示层,移开层隐藏层。代码:
$("#productTable td a").mousemove(function(e) {
$("#content").css("left", e.pageX).css("top", e.pageY).show(100);
});
$("#content").mouseout(function() {
$("#content").hide();
});
新闻列表有显示结果,但$("#productTable td a")获取不了a元素,而且查看源文件ajax生成的html都看不见?
$.each(json, function(i, n) {
var trs = "";
trs += "<tr><td style='text-align:center'><a href=\"#\" class=\"info2\">" + n.Title +
"</a></td><td style='text-align:center'>" + n.ReadTimes +
"</td><td style='text-align:center'>" + n.time + "</td></tr>";
tbody += trs;
});
你每次循環,trs都清空的。
ajax生成的HTML可以在Chrome或FireFox下按F12进行查看的
$("#productTable td a")返回的结果是个集合.你each以后,给每个item加mouse事件试试.