0

下面，我有一个 java 脚本函数（名为 stateChange），它有望更新 HTML 选择列表的内容（请参阅下面标记为 HERE 的代码部分）。我已经通过编写一些警报语句（即 xmlHttp.onreadystatechange=function() { alert(xmlHttp.responseText); }）验证了服务器是否正确返回了新数据。

基于函数中的这些警报语句，我注意到该行

      document.getElementById("dgpids").innerHTML=xmlHttp.responseText;

根本不执行，因此页面不会使用来自服务器的新数据进行更新。

有人可以告诉我我在下面的函数 stateChange 中缺少什么吗？为什么你认为页面没有更新新数据？谢谢。

     <%@page import="java.util.List"%>
     <%@page import="com.pm.dao.VirtualConfigTableDAO;" %>
     <%@page import="com.pm.entity.VirtualConfigEntity;" %>
     <%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
   <!DOCTYPE html>
   <html>
   <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>DAE PM Counters</title>

    <script language="javascript" type="text/javascript">  
        var xmlHttp              
        function stateChange(){                                  
            if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){   
                **//!!!!!! HERE !!!!!**
                //FOLLOWING LINE works                    
                xmlHttp.onreadystatechange=function() { alert(xmlHttp.responseText); }
                //I cannot update the list named dgpids below.
                //The content of the response text coming from the server is correct.
                //But the following line does not update the page. Do you know why???
                document.getElementById("dgpids").innerHTML=xmlHttp.responseText;   

                xmlHttp.onreadystatechange=function() { alert('Got here2!'); }                                       
            }                                  
        }

        function showState(str){
            if (typeof XMLHttpRequest != "undefined"){
                xmlHttp= new XMLHttpRequest();
            }
            else if (window.ActiveXObject){
                xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            if (xmlHttp==null){
                alert("Browser does not support XMLHTTP Request")
                return;
            } 
            var url="dgp.jsp";
            url +="?id=" +str;
            xmlHttp.onreadystatechange = stateChange;
            xmlHttp.open("GET", url, true);
            xmlHttp.send(null);
        }


    </script> 

</head>
<body>
    <form method="POST" name="me">
        <select size="13" name="D1"  multiple="no" onChange="checkData()">             
            <option value="1">CommonCounters(vDaeId)</option>
            <option value="2">DgpCommonCounters(dgpId, vDaeId)</option>
            <option value="3">SystemCommonCounters()</option>
        </select>
        <input type="submit" value="Submit" name="B1">
        <input type="reset" value="Reset" name="B2"></p>        
        <br/>

        <%
            VirtualConfigTableDAO dao = new VirtualConfigTableDAO();
            List<VirtualConfigEntity> vList = dao.getEntireVirtualConfigList();
        %>

        <select size="2" name="D2"  multiple="no" onChange="if (this.selectedIndex != -1) showState(this.value);" onclick="showState(this.value);">   
            <%
                for (VirtualConfigEntity entity : vList) {
            %>                              
            <option value="<%=String.valueOf(entity.getId())%>"> <%=String.valueOf(entity.getVirtualId())%></option>
            <%}%> 
        </select>


        <br/>
        <br/>
        <select name="dgpids" >  
            <option value='-1'></option>  
        </select>


    </form>
</body>

4

1 回答 1

0

您没有 id 为 的元素dgpids。

我认为您的意思是给 select 一个 id 但我不确定 select 是否允许innerHTML。您可能最好将选择包装在 a 中div并更新您的服务器代码以返回可以插入到 div 中的完整选择 html。

类似这个jsfiddle的东西。

希望这可以帮助。

于 2012-05-16T13:19:05.920 回答