javascript - 我们如何使用 jquery 在 select 标签中设置选项

Question

我的用户界面页面中有两个下拉菜单。当我选择第一个时，会生成第二个下拉列表。这是我的 html 代码

  <td width="100"><label for="type">Menu Category Name:</label></td>
        <td width="200">
            <select name="type" id="type" class="target dropdown required"  onchange = getSubCategory(); tabindex="3" >
                <?php echo $typeOption;?>
            </select>
        </td>


<tr height="50">    
        <td width="100"><label for="sub_type">Menu Sub Category Name:</label></td>
        <td width="200">
            <select name="sub_type" id="sub_type" class="sub dropdown required" tabindex="3" >

            </select>
        </td>

    <tr height="50">

我的 getSubCategory() 函数是

function getSubCategory(){
alert($("#type").val());
var catId = $("#type").val();
ajax(url,{id:catId,action:"getAllSubcategory"},function (response){
    $("div.sub").val(response);

});

这是我的后端 php 代码。我在这里设置每个选项

function getAllSubcategory(){
global $db;
$data = $_REQUEST;
$getProductSubType = "SELECT id, name FROM cp_reference_master WHERE active = 'Y' 
                   AND mode='item_type_subcat'AND parent_id = '".$data['id']."' ORDER BY name ASC";
$resultType = $db->func_query($getProductSubType);

$subTypeOption = '<option value="">Select Category</option>';
$subTypeList = array();
if(is_array($resultType) && count($resultType)>0){
    foreach($resultType as $key => $details){
        $subTypeOption .= '<option value="'.$details['id'].'">'.$details['name'].'</option>';
        $subTypeList[$details['id']] = $details['name'];
    }
}
 return $subTypeOption;

我需要设置对我的子类别选择标签的响应。我无法设置相同的。我的代码有什么问题。我已经尝试了 2 或 3 种解决方案。

Answer 1

您需要使用append() 或html() 而不是val()

此外，您向我们展示的代码中没有 div.sub 元素，因此我假设您想将响应添加到第二个选择标记:

function getSubCategory(){
    var catId = $("#type").val();
    ajax(url,{id:catId,action:"getAllSubcategory"},function (response){
        $("#sub_type").append(response);
    });
});