Javascript 是否在Jquery中刷新/清除更改事件的选择列表？

我的应用程序中有两个选择框，根据第一个选择框的选择值，第二个选择框的值将从DB显示。现在的问题是，如果我在第一个选择框中选择一个值，相应的值将显示在第二个选择框中，我再次更改第一个选择框中的值，第二个选择框不清除旧值，我的意思是新值正在添加到旧列表中，而不是更新。如何在更改第一个选择菜单时清除第二个选择列表中的旧值

我的代码如下：

Jquery：

 $("#select-choice").on('change', function(event) {
  //$('#select-choice-location option[value!="Select Location"]').remove();
          var catg = this.value;
          var db = window.sqlitePlugin.openDatabase({name: "MYDB"});
          db.transaction(function (tx) {
          tx.executeSql("select Location from Locationlog WHERE Category = '"+catg+"';", [], function (tx, res) {
          for (var i = 0; i < res.rows.length; i++) {
          var opt  = '<option value="';
          opt += res.rows.item(i).Location;
          opt += '">';
          opt += res.rows.item(i).Location;
          opt += '</option>';
          $("#select-choice-location").append(opt);
           }
          $("#select-choice-location").listview('refresh');
         });
         });
     });

HTML代码：

 <select name="select-choice" id="select-choice">
                      <option value="Select Category">Select Category</select>
              </select>
              <select name="select-choice-location" id="select-choice-location">
                  <option value="Select Location">Select Location</select>
              </select>

---

您没有清除旧选项htmls

使用空的，它将清除旧的

试试这个

$("#select-choice-location").empty().append(opt)

或

或

---

您没有清除旧选项htmls

使用空的，它将清除旧的

试试这个

$("#select-choice-location").empty().append(opt)

或

或

请使用此代码

$("#select-choice").on('change', function(event) {
      //$('#select-choice-location option[value!="Select Location"]').remove();
              var catg = this.value;
              var db = window.sqlitePlugin.openDatabase({name: "MYDB"});
              db.transaction(function (tx) {
              tx.executeSql("select Location from Locationlog WHERE Category = '"+catg+"';", [], function (tx, res) {
              for (var i = 0; i < res.rows.length; i++) {
              var opt  = '<option value="';
              opt += res.rows.item(i).Location;
              opt += '">';
              opt += res.rows.item(i).Location;
              opt += '</option>';
    $("#select-choice-location").empty();
              $("#select-choice-location").append(opt);
               }
              $("#select-choice-location").listview('refresh');
             });
             });
         });

请使用此代码

$("#select-choice").on('change', function(event) {
      //$('#select-choice-location option[value!="Select Location"]').remove();
              var catg = this.value;
              var db = window.sqlitePlugin.openDatabase({name: "MYDB"});
              db.transaction(function (tx) {
              tx.executeSql("select Location from Locationlog WHERE Category = '"+catg+"';", [], function (tx, res) {
              for (var i = 0; i < res.rows.length; i++) {
              var opt  = '<option value="';
              opt += res.rows.item(i).Location;
              opt += '">';
              opt += res.rows.item(i).Location;
              opt += '</option>';
    $("#select-choice-location").empty();
              $("#select-choice-location").append(opt);
               }
              $("#select-choice-location").listview('refresh');
             });
             });
         });

---

像这样试试，它会有用的

$("#select-choice").on('change', function (event) {
    $("#select-choice-location").empty(); // clear
    var catg = this.value;
    var db = window.sqlitePlugin.openDatabase({
        name: "MYDB"
    });
    db.transaction(function (tx) {
        tx.executeSql("select Location from Locationlog WHERE Category = '" + catg + "';", [], function (tx, res) {
            var opt = '<option value="">Select</option>';
            for (var i = 0; i < res.rows.length; i++) {
                opt += '<option value="';
                opt += res.rows.item(i).Location;
                opt += '">';
                opt += res.rows.item(i).Location;
                opt += '</option>';

                $("#select-choice-location").append(opt);
            }
            $('select').selectmenu('refresh', true);
        });
    });
});

参考这里

或者尝试使用此选项并应用自定义函数

var options = {
    Select1: ["A", "B", "C"],
    Select2: ["D", "E", "F"],
    Select3: ["G", "G", "I"]
};

$(function () {
    $('#firstSelect').change(function () {
        var x = $('#firstSelect :selected').val();
        $('#secondSelect').html("");
        for (index in options[x]) {
            $('#secondSelect').append('<option value="' + options[x][index] + '">' + options[x][index] + '</option>')
        };
    });
});

---

参考此

像这样尝试它会起作用

$("#select-choice").on('change', function (event) {
    $("#select-choice-location").empty(); // clear
    var catg = this.value;
    var db = window.sqlitePlugin.openDatabase({
        name: "MYDB"
    });
    db.transaction(function (tx) {
        tx.executeSql("select Location from Locationlog WHERE Category = '" + catg + "';", [], function (tx, res) {
            var opt = '<option value="">Select</option>';
            for (var i = 0; i < res.rows.length; i++) {
                opt += '<option value="';
                opt += res.rows.item(i).Location;
                opt += '">';
                opt += res.rows.item(i).Location;
                opt += '</option>';

                $("#select-choice-location").append(opt);
            }
            $('select').selectmenu('refresh', true);
        });
    });
});

参考这里

或者尝试使用此选项并应用自定义函数

var options = {
    Select1: ["A", "B", "C"],
    Select2: ["D", "E", "F"],
    Select3: ["G", "G", "I"]
};

$(function () {
    $('#firstSelect').change(function () {
        var x = $('#firstSelect :selected').val();
        $('#secondSelect').html("");
        for (index in options[x]) {
            $('#secondSelect').append('<option value="' + options[x][index] + '">' + options[x][index] + '</option>')
        };
    });
});

---

如果在for循环中使用.empty，那么我只能得到最后一个值。如果在for循环中使用.empty，那么它满足要求，但我无法在第二选择中选择一个选项menu@user3300593我发布了两个修改，请检查并更新我是的，我会检查并让您知道这些值不会重复。但是我无法选择second select Menui的第一个值如果您在for循环中使用.empty，如果有多个值，那么我只能得到最后一个值。如果我在for循环中使用.empty before，则满足要求，但我无法在第二选择中选择一个选项menu@user3300593我发布了两个修改，请检查并更新我是的，我会检查并让您知道这些值不会重复。但我无法选择第二个选择菜单的第一个值