AJAX 函数参数为空？答案

【问题标题】：AJAX function parameter is null?AJAX 函数参数为空？
【发布时间】：2011-10-05 09:04:30
【问题描述】：

我遇到了 JS 的问题：

在第 1 到 4 行，我从 DOM 中获取所有“a”元素并获取它们的 href。稍后我想通过 AJAX 重新加载 URL，但是 href 没有正确到达……怎么了？

$(document).ready(function(){
    $('a').click(function(e){
       ajaxReload($(this).attr('href'));
       e.preventDefault();
    });
});

function ajaxReload(href) {

var xmlhttp = null;

    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    // IE
    else if (window.ActiveXObject) {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.open("GET", href, true);
    xmlhttp.onreadystatechange = function() {

        if(xmlhttp.readyState != 4) {
            document.write('loading');
        }
        if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            alert('hello');
            //alert('getting '+xmlhttp.status+' for '+href);


            var pureHTML = xmlhttp.responseText;
            var ajaxstart = pureHTML.indexOf('<!-- AJAX START -->');
            var ajaxend = pureHTML.indexOf('<!-- AJAX END -->');
            var ajaxContent = pureHTML.substring(ajaxstart, ajaxend);

            var writeContent = document.getElementById('content');
            writeContent.innerHTML = ajaxContent;

        }
    }
    xmlhttp.send(null);
}

【问题讨论】：

href 没有正确到达是什么意思？
在底部，函数从 var 'href' 中引用的文件中获取 HTML 代码，但如果我在警报中输出它，'href' 将返回 null ..
你有 jQuery 可用。是否有任何原因您不使用 jQuery 提供的 AJAX 函数？！如果需要明文回复，可以使用dataType: 'text'。
是的，我刚开始学习 js，我想知道这个花哨的 jquery-stuff 背后是什么.. :-)

标签： javascript html ajax frontend

【解决方案1】：

抱歉，如果我误解了您的代码。我认为您只需要（至少大约）只需删除以下注释的代码：

//$('a').click = function(href) {

    var pureHTML = xmlhttp.responseText;
    var ajaxstart = pureHTML.indexOf('<!-- AJAX START -->');
    var ajaxend = pureHTML.indexOf('<!-- AJAX END -->');
    var ajaxContent = pureHTML.substring(ajaxstart, ajaxend);

    $("content").html(ajaxContent);

//  ajaxReload(href); //this would cause a loop?

//  return false;
//}

要回答您以后的问题 - 您可以将事件传播处理更改为：

$(document).ready(function(){
    $('a').click(function(e){
       ajaxReload($(this).attr('href'));
       e.preventDefault();
    });
});

对于更多的 cmets，也许可以尝试更改您的：

document.write('loading');

收件人：

$("content").html(xmlhttp.status); //so now you can see the loading status for testing

【讨论】：

...不是！我必须把 return false; 放在哪里？我把它放在顶部，这样DOM中的链接就不会被执行，但是脚本会停止。
你可以把 event.preventDefault();在调用 ajaxReload 的位置旁边的 click 函数中。或者在同一个地方返回 false。
hmm，两种方式都行不通，我尝试在点击事件中设置 return false，但同样的事情发生了..
上面的代码绝对可以阻止默认点击动作的发生。您遇到了什么问题？
好的，现在我明白了，上面的点击事件有效，但我没有得到 onreadystatechange 下面的函数，它一直在加载。