Question

我正在浏览数组中的项目列表。将这些选项通过 JQuery 输出到html SELECT。

我想将数组中的当前项与之前选择的变量进行比较，并将<option>属性设置为selected。

但它无法添加属性。

我做错了什么？

// PHP

$myAnimalArray = some filled array();
$s_current_selected = "Zebra";

//某些HTML表单

<select class="form-control" id="animals_select" name="animals_select"></select>

JQuery的

<script type="text/javascript">

        $(document).ready(function () {

            let animal_array = <?php echo json_encode($myAnimalArray); ?>;
            let animals_select = document.getElementById("animals_select");
            let current_selected = "<?php echo $s_current_selected; ?>";


            update_animal_options(animal_array);


            function update_animal_options(optionsArray) {

                $(animals_select).empty(); //remove any prior entries

                for (let i = 0; i < optionsArray.length; i++) {
                    $(animals_select).append('<option value=' + optionsArray[i] + '>' + optionsArray[i] + '</option>');

// HERE IS WHERE MY PROBLEM IS

                    if (optionsArray[i] == current_selected) {
                        $(animals_select).attr('selected', 'selected');
                    }

                }
            }

        });
</script>

Answer 1

属性selected是<option>的一部分，而不是<select>本身。您应该将代码修改为：

function update_animal_options(optionsArray) {
    $(animals_select).empty();

    $(animals_select).append(
        '<option value=' + optionsArray[i] 
        + (optionsArray[i] == current_selected? ' selected' : '') + '>' 
        + optionsArray[i] + '</option>'
    );
}

另外，将总是包装在引号中的属性值是一个好主意。否则，value=Some value here之类的代码将不会按预期处理。

在从PHP数组填充的JQuery HTML选择列表上设置SELECTED属性

1 个答案: