javascript - Jquery $(document) on change 返回空值以取消选择

Question

我正在使用 Django 表单，并使用 $(document) on change 修改其中一个字段的选项列表(在 HTML 中)以用于表单中的不同字段。当我选择一个选项时(多选列表，可以选择多个 - 不是复选框)，

this.value

返回正确的值。但是，当我取消选择该选项时，

this.value

返回空值。为什么会这样？是否仅在选择某项(而不是取消选择)时才返回值？如果是这样，我怎样才能得到取消选择的元素的值

这是我的代码:

$(document).on("change", "#name2", function () {
    var url = #the url I'm using
    url += "&field=" + this.value + "&visible=1";
    value = this.value
    ...etc

Answer 1

jQuery val()将在 <select multiple> 上返回一个值数组或 null(取决于版本):

$(document).on('change', '#name2', function() {
  var val = $(this).val()
  console.log(val ? val : 'None selected');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select size="20" id="name2" multiple="">
<option value="1">Item 1</option>
<option value="2">Item 2</option>
<option value="3">Item 3</option>
<option value="4">Item 4</option>
<option value="5">Item 5</option>
<option value="6">Item 6</option>
<option value="7">Item 7</option>
<option value="8">Item 8</option>
<option value="9">Item 9</option>
<option value="10">Item 10</option>
</select>