如何知道jQuery的「選擇」輸入值已更改？

Question

我知道在jQuery中有change事件處理與select類型的輸入相關聯。但我想知道用戶是否在select元素中選擇了另一個值！所以我不想在用戶選擇一個新的元素時運行代碼，但我想知道用戶是否選擇了不同的值！ 實際上，我的表單中有兩個選擇元素，我只想在兩個select元素髮生變化時纔會啓動ajax。那麼如何知道這兩個要素已經發生了變化？

Answer 1

可以專門通過設置在你的JavaScript文件結合聽你所選擇的元素上的改變事件。

雖然這隻能解決一半的問題。您想知道何時選擇了不同的元素。

您可以通過創建每次觸發事件時更新的跟蹤變量來實現此目的。

首先，爲您的跟蹤變量提供一個永遠不會出現在下拉列表中的值。

// Hugely contrived! Don't ship to production! 
var trackSelect = "I am extremely unlikely to be present"; 

然後，您需要設置一個函數來處理更改事件。

事情就這麼簡單： -

var checkChange = function() { 
    // If current value different from last tracked value 
    if (trackSelect != $('#yourDD').val()) 
    { 
    // Do work associated with an actual change! 
    } 

    // Record current value in tracking variable 
    trackSelect = $('#yourDD').val(); 
} 

最後，你需要的document.ready接線的事件了。

$(document).ready(function() { 
    $('#yourDD').bind('change', function (e) { checkChange() }); 
}); 

Answer 2

首先，您可以使用select事件處理程序（設置某些標誌的值）。這是如何工作的：

$('#select').change(function() { 
    alert($(this).val()); 
});​ 

演示：http://jsfiddle.net/dXmsD/

或者你可以在一些地方保存原來的值，然後檢查：

$(document).ready(function() { 
    var val = $('#select').val();  
    ... 
    // in some event handler 
    if ($('#select').val() != val) ... 
    ... 
}); 

Answer 3

可以保存一些在頁面加載值隱藏的領域。

像

$(document).ready(function(){ 
$('hiddenFieldId').val($('selectBoxId').val()); 
then on change you can grab the value of select: 
}); 
    $('selectBoxId').change(function(){ 
    var valChng = $(this).val(); 
    // now match the value with hidden field 
    if(valChng == $('hiddenFieldId').val()){ 
    } 
    }); 

Answer 4

$("select").change(function() { 
     var str = ""; 
     $("select option:selected").each(function() { 
      str += $(this).text() + " "; 
      }); 
     $("div").text(str); 
    }) 
    .change(); 

http://docs.jquery.com/Events/change

Answer 5

首先您需要存儲選定選項的前一個值，然後您應該檢查新選定的值是否與存儲值不同。

查看sample！

$(document).ready(function() { 
    var lastValue, selectedValue; 
    $('#select').change(function() { 
     selectedValue = $(this).find(':selected').val(); 
     if(selectedValue == lastValue) { 
      alert('the value is the same'); 
     }    
     else { 
      alert('the value has changed'); 
      lastValue = selectedValue; 
     } 
    }); 
});​