Ajax代碼未附加到html select語句

Question

我有兩個選擇，一個用於選擇組，另一個用於顯示子組類別。

<div class="frmDronpDown">
    <div class="row">
        <label>group:</label><br/>
        <select name="country" id="country-list"  onChange="getState(this.value);">

        <?php while($x--)
        {
            echo "<option value='.$group_id[$x].'>$group_name[$x]</option>";} ?>
        </select> 
    </div>
    <div class="row">
        <label>Services:</label><br/>
        <select name="state" id="state-list" class="demoInputBox">
        </select>
    </div>
</div>

和jQuery函數：

function getState(val) {
    $.ajax({
        type: "POSt",
        url: "http://abcd/Get_Service.php",
        data:'gp_id='+val,
        success: function(data){
            $("#state-list").html(data);
        }
    });
}

PHP輸出：

<option value='5'>V Cut</option><option value='11'>Hair Wash Girls</option>
<option value='12'>Lakme Hair Cut</option>

我已經嘗試了很多事情，但是仍然無法獲得正確的輸出。

Answer 1

您不能在選擇框上設置html屬性，而不能給服務div輸入ID

<div class="row" id="services">
    <label>Services:</label><br/>
    <select name="state" id="state-list" class="demoInputBox">
    </select>
</div>

然后在您的php頁面中，將以下html代碼放在php文件中的輸出代碼周圍

<label>Services:</label><br/>
<select name="state" id="state-list" class="demoInputBox">
// Your php page output
</select>

然后最后在您的ajax代碼中進行以下更改。

function getState(val) {
$.ajax({
    type: "POSt",
    url: "http://abcd/Get_Service.php",
    data:'gp_id='+val,
    success: function(data){
        $("#services").html(data);
    }
});
}

Answer 2

羅漢（Rohan）在評論中說：
“ 跨域請求被阻止：同一起源策略不允許讀取Get_Service.php上的遠程資源。（原因：缺少CORS標頭'Access-Control-Allow-Origin'） 。”

那是因為您嘗試使Ajax請求不同於原始域：主機和/或端口不同

嘗試使用此JavaScript函數：

function getState(val) {
    $.ajax({
        type       : "POSt",
        url        : "http://abcd/Get_Service.php",
        data       : "gp_id=" + val,
        dataType   : "jsonp",
        crossDomain: true,        
        success    : function(data){
            $("#state-list").html(data);
        }
    });
}

Answer 3

function getState(val) {
    $.ajax({
        type: "POSt",
        url: "http://abcd/Get_Service.php",
        data:'gp_id='+val,
        success: function(data){
        document.getElementById("state-list").innerHTML=data;
        }
    });
}

嘗試覆蓋id狀態列表的innerHTML