外部文件中的Ajax函数

时间:2014-12-14 19:19:28

标签: javascript php jquery ajax

我有一个ajax电话。当我将它放在一个文件中时,这个脚本工作正常,其中包含将加载脚本的表单。

$(document).ready(function () {
    $("#uploadbutton").click(function () {
        var referenceNumber = document.getElementById('referenceNumber').value;
        $.ajax({
            type: "POST",
            url: "selectReferenceOrder.php",
            data: 'referenceNumber='+referenceNumber,
            cache: false,
            //data: $('form').serialize(),
            success:function(html)
            {
                document.getElementById('outputReference').innerHTML = html;
                alert('referenceNumber');
            }
        });
    });
});

但是,当我尝试将它放在外部文件中时,它不会给我任何东西。

此ajax的脚本用作将表单发布到php文件的脚本。

Reference: <input type="text" id="referenceNumber" /> 
<input type="button" id="uploadbutton" value="SEARCH"/>

我尝试了很多方法,但它仍然不起作用:

<input type="submit" value="SEARCH" onclick="collectActed()" />

function collectActed () {
    var referenceNumber = document.getElementById('referenceNumber').value;
    $.ajax({
        type: "POST",
        url: "selectReferenceOrder.php",
        data: 'referenceNumber='+referenceNumber,
        cache: false,
        success:function(html) {
            document.getElementById('outputReference').innerHTML = html;
        }
    });
}

请帮助。

1 个答案:

答案 0 :(得分:0)

以下代码效果很好:

<html>
<head>
        <title>Ajax Search</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            function searchFor(suchbegriff) {
                var xmlHttp = null;
                // Mozilla, Opera, Safari sowie Internet Explorer 7
                if (typeof XMLHttpRequest != 'undefined') {
                    xmlHttp = new XMLHttpRequest();
                }
                if (!xmlHttp) {
                    // Internet Explorer 6 und älter
                    try {
                        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
                    } catch (e) {
                        try {
                            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                        } catch (e) {
                            xmlHttp = null;
                        }
                    }
                }
                // If object has been created       
                if (xmlHttp) {
                    var url = "search.php";
                    var params = "search=" + search;

                    xmlHttp.open("POST", url, true);

                    //Headerinformatio for POST request
                    xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                    xmlHttp.setRequestHeader("Content-length", params.length);
                    xmlHttp.setRequestHeader("Connection", "close");

                    xmlHttp.onreadystatechange = function () {
                        if (xmlHttp.readyState == 4) {
                            // Zurückgeliefertes Ergebnis wird in den DIV "ergebnis" geschrieben
                            document.getElementById("result").innerHTML = xmlHttp.responseText;
                        }
                    };
                    xmlHttp.send(params);
                }
            }
        </script>
        <script>
$(document).ready(function(){
  $("input").click(function(){
    $("div").load("search.php");
  });
});
</script>
    </head>
    <body>
        <input type="text" onkeyup="searchFor(this.value);"/>
        <div id="search"></div>
    </body>
</html>