JQuery 移动 select 框未显示 selected 选项

Question

我希望有人能帮助我寻找答案并尝试了很多选择…..我有一个 HTML5 数据库和更新的表，然后 select 框被清空，创建了新的 select 选项。问题是没有显示 selected 选项。下面是实际查询Mobile的代码。谢谢

function updateCList() {
    db.transaction(function (tx) {
        tx.executeSql('SELECT * FROM CourseTable', [], function (tx, results) {
            var len = results.rows.length, i;
            $('#coursemenu').empty();
            SelectOption(document.courseData_form.coursemenu, "Course Type", "Course Type")
            for (i = 0; i < len; i++){
                SelectOption(document.courseData_form.coursemenu, results.rows.item(i).c_type, results.rows.item(i).c_type);
            }
        }, null);
        $('#coursemenu').selectmenu('refresh', true);           
    });
}

Answer 1

executeSql()是一个异步函数，所以当你调用selectmenu('refresh', true)更新元素时，选项还没有添加。为避免这种情况，将更新命令移至 executeSql() 函数内部，如下所示：

tx.executeSql('SELECT * FROM CourseTable', [], function (tx, results) {
    var len = results.rows.length, i;
    $('#coursemenu').empty();
    SelectOption(document.courseData_form.coursemenu, "Course Type", "Course Type")
    for (i = 0; i < len; i++){
        SelectOption(document.courseData_form.coursemenu, results.rows.item(i).c_type, results.rows.item(i).c_type);
    }
    $('#coursemenu').selectmenu('refresh', true);   
}, null);

阅读 docs 中有关函数和语法的更多信息。

Answer 2

这是我的解决方法。当我使用空命令时，默认的 link 被破坏，这段代码删除了除第一个之外的所有选项。

            function emptyCList() {
                var select = document.getElementById("coursemenu");
                var len = select.options.length;
                for (i = len; i > 0; i--) {
                    select.options[i] = null;
                };
            };

JQuery 移动 select 框未显示 selected 选项

JQuery Mobile select box not displaying selected option

jquery

select

jquery-mobile