0

我有一个表格,里面有印度州和城市的列表。在选择其中一个州时,该州的城市将显示在<select>要显示的城市中。我正在使用托管在某处(类似网站)的 php 脚本,我认为它可以解决我的目的。该脚本将valueof State options作为参数并返回 a<select>和相应的城市。

脚本是所选http://www.indane.co.in/state.php?stateid=2196状态2196的 ID/值。

我需要在我的城市中显示此内容。

请建议我该怎么做。

到目前为止,我已经尝试过,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
function showcat(id,ss,type)
{
    var cid=id.value;
    if(type=='state')
    {
        document.getElementById("state_loading").style.visibility="visible";
        var response = httpGet("http://www.indane.co.in/state.php?stateid="+cid);
        var id=document.getElementById('bgcity');
        id.innerHTML=response;
    }
}
function httpGet(theUrl)
    {
    var xHRObject = new XMLHttpRequest();
var url = theUrl;
xHRObject.open("GET", url, true);
xHRObject.send();
xHRObject.onreadystatechange = function () {
if (xHRObject.readyState==4 && xHRObject.status==200) {
    var response = xHRObject.responseText;             
      return response;
    }
}
    }
</script>
</head>

<body>
<select name="bgstate" id="bgstate" style="width:200px" onChange="showcat(this,'sub1','state');">
                  <option value="">[ SELECT STATE ]</option>
                                          <option value="2169" >Andhra Pradesh</option>
                                          <option value="2196" >Arunachal Pradesh</option>
                                          <option value="2170" >Assam</option>
                                          <option value="2171" >Bihar</option>
                                          <option value="5267" >Chhattisgarh</option>
                                          <option value="2174" >Delhi</option>
                                          <option value="2199" >Goa</option>
                                          <option value="2175" >Gujarat</option>
                                          <option value="2176" >Haryana</option>
                                          <option value="2177" >Himachal Pradesh</option>
                                          <option value="2178" >Jammu and Kashmir</option>
                                          <option value="5268" >Jharkhand</option>
                                          <option value="2185" >Karnataka</option>
                                          <option value="2179" >Kerala</option>
                                          <option value="2181" >Madhya Pradesh</option>
                                          <option value="2182" >Maharashtra</option>
                                          <option value="2183" >Manipur</option>
                                          <option value="2184" >Meghalaya</option>
                                          <option value="2197" >Mizoram</option>
                                          <option value="2186" >Nagaland</option>
                                          <option value="2187" >Orissa</option>
                                          <option value="2189" >Punjab</option>
                                          <option value="2190" >Rajasthan</option>
                                          <option value="2195" >Sikkim</option>
                                          <option value="2191" >Tamil Nadu</option>
                                          <option value="2192" >Tripura</option>
                                          <option value="5269" >UNION TERRITORY</option>
                                          <option value="2193" >Uttar Pradesh</option>
                                          <option value="5259" >Uttaranchal</option>
                                          <option value="2194" >West Bengal</option>

                    </select>           
                    <span id="state_loading" style="visibility:hidden;"><img src="http://www.indane.co.in/images/ajax_small_load.gif" /></span>     
                </td>
            </tr>

            <br/>
            <tr valign="top">
              <td>&nbsp;</td>
              <td height="25" >City <span class="error">*</span></td>
              <td colspan="2">
              <span id="sub1">
              <select name="bgcity" style="width:200px" id="bgcity" >
                 <option value="">[SELECT CITY]</option>
                </select>  
               </span> 
                <span id="city_loading" style="visibility:hidden;"><img src="http://www.indane.co.in/images/ajax_small_load.gif" /></span>          
                <input type="button" value="Search"  onClick="showcat(document.getElementById('bgcity'),'sub2','city');" style="cursor:pointer;" />

            </tr>    
</body>
</html>
4

1 回答 1

1

问题 1-问题是城市下拉列表的 URL 返回一个选择框,并且您正在用另一个选择框替换页面中选择框的选项

另一个问题是 access-control-allow-origin 标头。

将页面中的城市下拉列表替换为以下内容

       <span id="bgcity">
      <select name="bgcity" style="width:200px" >
         <option value="">[SELECT CITY]</option>
        </select>  
       </span> 

将您的 showcat 更改为

function showcat(id,ss,type)
{
   var cid=id.value;
   if(type=='state')
   {
        document.getElementById("state_loading").style.visibility="visible";
        var response = httpGet("http://www.indane.co.in/state.php?stateid="+cid);
         if(response !== undefined)
        {
           var id=document.getElementById('bgcity');
           id.innerHTML=response;
        }
    }
}

我已将与选择框关联的 id 删除到 span 中,以便它替换整个下拉列表。并删除 showcat 函数中的第二个参数,因为此更改将给出错误...

于 2013-09-04T06:24:12.020 回答