使用ajax和jquery替换div内容
我尝试下面的代码来取代div内容,但它不工作我做错了什么?
function MakeRequest()
{
$("#page_num li").click(function() {
var id=(this.id);
alert(id);
$.ajax({
url : 'display.php',
data:{"id":id},
type: 'GET',
success: function(data){
$('#ResponseDiv').html(data);
}
});
});
}
//列表以获取价值
<ul id="page_num">
<li id="5" onclick='MakeRequest();' ><a href="#">5</a></li>
<li id="10" onclick='MakeRequest();' ><a href="#">10</a></li>
<li id="15" onclick='MakeRequest();' ><a href="#">15</a></li>
</ul>
// div来替换
<div id='ResponseDiv'>
This is a div to hold the response.
</div>
//我的display.php
<?php
echo "This is a php response to your request!!!!!!";
?>
编辑:我如何检查它的去或不去我的display.php。 我有尝试解决方案,但没有取得成功。
您的代码具有定义onclick操作的功能,并且不会自行创建呼叫。 我敢打赌,如果你双击链接,它会工作,但你应该这样做:
function MakeRequest(id)
{
$.ajax({
url : 'display.php',
data:{"id":id},
type: 'GET',
success: function(data){
$('#ResponseDiv').html(data);
}
});
}
最后,将此调用更改为:
onclick='MakeRequest(5);'
或者只是这样做,它将li元素绑定到click函数,并且不需要“onclick”:
$(document).ready(function()
{
$("#page_num li").click(function() {
var id=$(this).attr(id);
$.ajax({
url : 'display.php',
data:{"id":id},
success: function(data){
$('#ResponseDiv').html(data);
}
});
});
});
删除MakeRequest()
函数只需尝试使用$("#page_num li").click
否则,它会调用函数两次
$(document).ready(function(){
$("#page_num li").click(function() {
var id=(this.id);
$.ajax({
url : 'display.php',
data:{"id":id},
type: 'GET',
success: function(data){
$('#ResponseDiv').html(data);
}
});
});
});
你有绑定到该函数的onclick事件,称为MakeRequest
然后在该函数中再次将li
绑定到单击事件。
你最好采取这种方法:
$(function(){
$("#page_num li").click(function() {
$.ajax({
url : 'display.php',
data:{id: $(this).attr('id')},
type: 'GET',
success: function(data){
$('#ResponseDiv').html(data);
}
}
});
并摆脱内联onclick
事件。
上一篇: replace div content using ajax and jquery
下一篇: PHP header(Location: ...): Force URL change in address bar