添加json2.js时出现语法错误

时间:2011-06-15 06:47:35

标签: javascript ajax json jsp servlets

我想在jsp页面中显示来自servlet的json响应。下面是代码。但是当我包含json2.js时,浏览器会报告语法错误。我在liferay门户网站上工作。如果我做错了,请建议。

<html>
<head><script type="text/javascript"> var AJAX_SERVLET="<%=renderResponse.encodeURL(renderRequest.getContextPath())%>/ajaxServlet";
</script>               
<script type="text/javascript" src="json2.js">
/**
 * This file contains the base Ajax call to Servlet
 */
function getXMLObject() //XML OBJECT
{
    //alert("loading...");
    var xmlHttp = false;
    try {

        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP") // For Old Microsoft Browsers
    } catch (e) {
        try {

            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") // For Microsoft IE 6.0+
        } catch (e2) {
            xmlHttp = false // No Browser accepts the XMLHTTP Object then false
        }
    }
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {

        xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers
    }

    return xmlHttp; // Mandatory Statement returning the ajax object created
}

var xmlhttp = new getXMLObject(); //xmlhttp holds the ajax object

function ajaxFunction() {
    if (xmlhttp) {
        xmlhttp.open("GET", AJAX_SERVLET, true); //AJAX_SERVLET has the servlet path
        xmlhttp.onreadystatechange = handleServerResponse;
        //xmlhttp.setRequestHeader('Content-Type',
                //'application/x-www-form-urlencoded');
        xmlhttp.send(null);
    }
}
function handleServerResponse() {
alert(xmlhttp.readyState);
    if (xmlhttp.readyState == 4) {
        alert(xmlhttp.status);
        if (xmlhttp.status == 200) {
        alert(xmlhttp.responseText);
            var json = JSON.parse(xmlhttp.responseText);
            alert (json);
            // json now contains an array of objects, eg:            
            //            
            // [            
            //   {            
            //     "productNumber"  : "001",           
            //     "productType"    : "User Manual",           
            //     "funcDesignation": "Operator"            
            //   }            
            // ]    
            // grab the first (and only) object in the array             
            var firstRecord = json[0];
                // update the UI by selecting DOM elements and rewriting their contents          
            document.getElementById('product-number').innerHTML = firstRecord.productNumber;            
            document.getElementById('product-type').innerHTML =   firstRecord.productType;             
            document.getElementById('func-designation').innerHTML = firstRecord.funcDesignation;            
            } else {
            alert("Error during AJAX call. Please try again");
        }
    }
}</script>
 </head>
<body>
    <form name="myForm">
        <h4>
            <b>Hello</b>,
        </h4>
        <h5><%=renderRequest.getAttribute("userName")%></h5>
        <div id="maincontent">
            <div class="innertube">
                <h4>Search Criteria</h4>
                <table style="border: 1px solid #9f9f9f; float: left"
                    cellspacing="1">
        <table style="border: 1px solid #9f9f9f; float: right;">

<tr><td><label for="status">Search Status</label></td>
<td><input type="text" id="status" name="status" dojoType="dijit.form.TextBox" size="40"
value="Please enter search criteria" /></td>
</tr>
<tr>
<td><label for="push">Push to start</label></td>
<td><button dojoType="dijit.form.Button" style="width: 4em" type="button" name="submitButton" value="Submit" onclick="ajaxFunction()"></button></td>
</tr>
</table>
</div>
</div>
<div id="framecontent">
<div class="innertube">
    <div>Number: <span id="product-number"></span></div> 
    <div>Type: <span id="product-type"></span></div> 
    <div>Function: <span id="func-designation"></span></div>
    </div>
    </div>
    </form>
</body>
</html>

2 个答案:

答案 0 :(得分:3)

似乎/json2.js指向非JavaScript文件。你可以验证服务器上是否存在此文件,并且/json2.js已解析为所需文件?否则,使用JSON解析器实现的绝对路径:

<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>

答案 1 :(得分:0)

您可以使用<script>标记在页面中包含脚本以加载外部文件。所以:

<script type="text/javascript" src="json2.js" />
<script type="text/javascript">
    /**
    * This file contains the base Ajax call to Servlet
    */
    function getXMLObject() //XML OBJECT
    {}
</script>