在执行AJAX功能时添加加载文本

时间:2015-06-30 06:40:26

标签: javascript php html ajax

我一直在尝试添加一个加载文本,该文本会在AJAX函数执行很长一段时间后显示,而我的所有尝试(包括使用ajaxStart和ajaxStop等)都没有一直在努力。任何帮助表示赞赏!

Here是相关脚本所在的网页,如果您想查看它的实际效果。它的工作方式是输入一个url,该函数将获取该URL的元标记。

同时,这里是相关的HTML,Javascript和PHP:

HTML

<!DOCTYPE html>
    <html>
        <head>
            <title>Keywords Grabber</title>

            <script src="ajax.js"></script>
            <script>
                function display(content) {
                    document.getElementById("displaydiv").innerHTML = content;
                }
                window.onload = function () {
                    document.getElementById("btn1").onclick = function () {
                        var url = document.getElementById("txt1").value;
                        doAjax("metatags.php", "url=" + url, "display", "post", 0);
                    }
                }
            </script>


        </head>
        <body>
            http://<input type="text" id="txt1" value="" />
            <input type="button" id="btn1" value="Get Keywords" />
            <h3>Keywords Received:</h3>
            <div id="displaydiv"></div>



        </body>
    </html>

的JavaScript

 function getXMLHttpRequest() {
    try {
        try {
            return new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e) {
            return new ActiveXObject("Msml2.XMLHTTP");
        }
    }
    catch(e) {
        return new XMLHttpRequest();
    }
}
function doAjax(url, query, callback, reqtype, getxml) {
    var myreq = getXMLHttpRequest();
    myreq.onreadystatechange = function () {
        if (myreq.readyState == 4) {
            if (myreq.status == 200) {
                var item = myreq.responseText;
                if (getxml == 1) item = myreq.responseXML;
                eval(callback + '(item)'); 
        }
    }
}
if (reqtype.toUpperCase() == "POST") {
    requestPOST(url, query, myreq);
    } else {
        requestGET(url, query, myreq);
    }
    }

function requestGET(url, query, req) {
    var myRandom = parseInt(Math.random()*99999999);
    if (query == '') {
        var callUrl = url + '?rand=' + myRandom;
    } else {
        var callUrl = url + '?' + query + '&rand=' + myRandom;
    }
    req.open("GET", callUrl, true);
    req.send(null);
}
function requestPOST(url, query, req) {
    req.open("POST", url, true);
    req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    req.send(query);
}

PHP

    <?php
$tags = @get_meta_tags('http://'.$_REQUEST['url']);
$result = $tags['keywords'];
if(strlen($result) > 0) {
    echo $result;
} else {
    echo "No keywords metatag is available.";
}
?>

1 个答案:

答案 0 :(得分:1)

类似这样的事情

 <div id="loading" style="display:none;">loading</div>

的Javascript

 $('#loading').css('display', 'block');
 $.post(url, {}, function(data){
      $('#loading').css('display', 'none');
});