使用ajax和jquery替换div内容 [英] replace div content using ajax and jquery

问题描述

我尝试使用以下代码替换div内容，但我做错了什么呢?

I try following code to replace div content but its not working what i am doing wrong?

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

//my display.php

<?php 
   echo "This is a php response to your request!!!!!!";
?>

我如何检查它去我的display.php. 我有尝试解决方案，但没有成功.

how can i check its going or not to my display.php. i have try solution but not get success.

推荐答案

您的代码具有定义onclick操作且不会自行进行调用的函数.我敢打赌，如果您双击该链接将起作用，但是您应该这样做:

Your code has a function which defines an onclick action and doesn't make the call itself. I bet if you double clicked the link it would work, but you should do it like this:

function MakeRequest(id)
{
    $.ajax({
        url : 'display.php',
        data:{"id":id},
        type: 'GET',

        success: function(data){
            $('#ResponseDiv').html(data);
        }
    });
}

最后，将呼叫更改为此:

Finally, change the call to this:

onclick='MakeRequest(5);'

只需执行此操作，它将li元素绑定到click函数，而无需"onclick":

OR just do this, which binds the li element to the click function and no "onclick" is necessary:

$(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);
        }
    });
});
});

这篇关于使用ajax和jquery替换div内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！