Ajax时jQuery Return链接不起作用

时间:2008-12-18 13:36:10

标签: jquery ajax hyperlink

jQuery返回链接不起作用。我使用了jQuery和基本的Ajax功能。我的jQuery返回文件Links_ajax.php中的链接。

我提供代码示例。

GetCustomerData.php有:

<html>
    <script type="text/javascript">
    <script src="ajax.js" type="text/javascript">

        $(function() {
            .....

            $.ajax({
                type: 'POST',
                url: 'Links_ajax.php',
                data: 'category='+category  ,
                success: function(data){
                    $("#response").html(data);
                }
            });
        }
        ......
    }

    ...

    <! Links return here
        <div id="response">
        </div>
</html>

<?
  echo "Some Code";


?>

  ....

My Links_ajax.php具有以下代码

....

echo '<a href="getCustomerData.php?id=10" onclick="requestCustomerInfo();return false;">show me </a>';
echo '<a href="getCustomerData.php?id=11" onclick="requestCustomerInfo();return false;">show me </a>';

....

现在我来到主页面getCustomerData.php。我使用了从Links_ajax.php返回链接的Ajax功能。

 .....

所以,我的ajax.js有以下Ajax脚本。

var url = "GetCustomerData.php?id="; // The server-side script
function handleHttpResponse() {
    if (http.readyState == 4) {
        if (http.status == 200) {
            var results = http.responseText;
            document.getElementById('divCustomerInfo').innerHTML = results;
        }
    }
}

function requestCustomerInfo(event) {
    if(event &&event.preventDefault) event.preventDefault();
    else if (window.event && window.event.returnValue)
        window.eventReturnValue = false;
        var sId = 10;
        http.open("GET", url + escape(sId), true);
        http.onreadystatechange = handleHttpResponse;
        http.send(null);
    }

    function getHTTPObject() {
        var xmlhttp;

        if (window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        }
        else if (window.ActiveXObject){
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            if (!xmlhttp){
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
        }
        return xmlhttp;
    }

    var http = getHTTPObject(); // We create the HTTP object

...

现在我遇到了问题。当我执行GetCustomerdata.php时,我能够从ajax.JQuery获取所有链接。 点击后,我需要一个基本的Ajax功能,因为加载相同的<div> </div>。但即使我做完了,我也无法看到它。 我的代码有什么问题吗?或者我必须使用任何其他功能吗?

3 个答案:

答案 0 :(得分:0)

首先尝试以下方法:

success: function(data){
     //$("#response").html(data);
     alert(data);
   }

因此,您将知道它是否真的返回数据。

如果这样做,那么你可以替换

`$("#response").html(data)`  

 document.getElementById('response').innerHTML = data;

这应该有用。

答案 1 :(得分:0)

我强烈建议您使用FireFox + FireBug进行测试,或者使用其他浏览器通过HTTP代理来记录您的流量。 FireBug将向您显示页面中的所有Ajax请求和响应,并且应该可以帮助您确定数据是否会回来,以及是什么。

答案 2 :(得分:-1)

首先我想知道你为什么在已经拥有jquery对象的情况下编写自定义函数HTTPrequest,实际上你已经在顶部使用了$ .ajax但后来创建了getHTTPObject()。

问题是javascript函数requestCustomerInfo()从不委托处理ajax响应数据的链接,你需要将该函数委托为ajax请求的回调

$.ajax({
       type:'POST',
       url: 'Links_ajax.php',
       dataType: 'html',
       data:'category='+category,
       success: function(data){
           $("#response").html(data);
           // here add the link click handler
           $("#response a").click(function(){
                // make http get request & custom handler
                $.get('GetCustomerData.php?id=10',function(result){
                    $('#divCustomerInfo').html(result);
                }); return false;
            });
       }
});