Question

从上面的选择菜单中选择一个选项后，我有三个动态填充的选项。如果我从第一个选择中选择一个选项，则第二个选项按预期填充，但如果我更改了第一个选项，则选项将附加到预先存在的选项，而不是重置选择，然后填充新数据。我确信当我想要从那里清除旧数据时，我可以调用某种重载或重置方法在填充新数据之前，我找不到它。

的Javascript

<script>
  $(function() {
    $("#service").change(function() {
      var service = $(this).val();
        $.ajax({
          type: "GET",
            url: "<?=Config::get('baseURL');?>getdata.php",
            data: { service: service },
            dataType: "json"
        }).done(function(reply) {
          console.log(reply);  
            $.each(reply, function(key, value) {   
                $('#category').append($('<option>', { value: value.value }).text(value.text)); 
            });
        });

    });
  });
  $(function () {
    $("#category").change(function() {
      var service = $("#service").val();
      var category = $(this).val();
      $.ajax({
          type: "GET",
          url: "<?=Config::get('baseURL');?>getdata.php",
          data: {
              service: service,
              category: category
          },
          dataType: "json"
      }).done(function (reply) {
          $.each(reply, function (key, value) {
              $("#subCategory").append($('<option>', {
                  value: value.value
              }).text(value.text));
          });
      });
    });
  })
</script>

此代码工作正常，但如果我在前面的下拉列表中更改选项，我怎么能调整它以清除那里的旧数据？

Answer 1

意味着要先发布这个帖子。不久之后想出来了。它为我完成了工作。它可能根本不是很漂亮。

  $(function() {
    $("#service").change(function() {
      var service = $(this).val();
        $.ajax({
          type: "GET",
            url: "<?=Config::get('baseURL');?>getdata.php",
            data: { service: service },
            dataType: "json"
        }).done(function(reply) {
          $("#category").find('option').remove();
          $('#category').append($('<option>').text("--Please Select a Category--"));


            $.each(reply, function(key, value) {   
                $('#category').append($('<option>', { value: value.value }).text(value.text)); 
            });
        });

    });

    $("#category").change(function() {
      var service = $("#service").val();
      var category = $(this).val();
      $.ajax({
          type: "GET",
          url: "<?=Config::get('baseURL');?>getdata.php",
          data: {
              service: service,
              category: category
          },
          dataType: "json"
      }).done(function (reply) {
        $("#subCategory").find('option').remove();

        if (reply.length > 1) {
          $('#subCategory').append($('<option>').text("--Please Select a Sub-Category --"));
          $.each(reply, function (key, value) {
            $("#subCategory").append($('<option>', {
                value: value.value
            }).text(value.text));
          });
        } else {
          var value = reply[0];
          $("#subCategory").append($('<option>', { value: value.value }).text(value.text));

        } 
      });
    });
  });

重置下拉列表在更改招聘选项时选择

1 个答案: