返回 false 時保留下拉值

Question

對於下面的下拉列表，當我 select 任何值時，我必須進行確認（確定/取消），如果用戶選擇取消，我需要保留以前的 state。 發生的事情是點擊 Cancel 並return false; ，新值被選中，而不是保留以前的值。 單擊取消時，如何確保選擇了先前的值。 我嘗試使用下面的代碼，但似乎沒有幫助：

var ele = document.getElementById('mySelect');
ele.selected = ele.defaultSelected;            
return false;

<select id="mySelect" multiple="multiple">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

Answer 1

你在這里 go :)

<script type="text/javascript">
$(document).ready(function () {
   $("#mySelect").mousedown(function() {
         var old_value = $("#mySelect").val();
         var confirm_selection = confirm("Are you sure?");
         if (!confirm_selection)
         {
            $("#mySelect").val(old_value);
            return false;
         }
    }); 

});

</script>

只需將確認文本更改為您喜歡的任何內容。

必須使用 mousedown() 而不是 change() ，因為使用 change 時，function 將在選擇新項目后被調用，因此無法知道選擇了前一個項目。

Answer 2

我認為-我認為-，唯一的解決方案是保留先前選擇的值並在取消時再次設置它。 您可以使用val()輕松設置 select 的值。

簡要地：

prev_val = $('#myselect').val();

if (cancel) {
    $('#myselect').val(prev_val);
}