Используя прямой JavaScript и DOM, что-то вроде этого ( живой пример ):
var box, oldValue;
// Get a reference to the select box's DOM element.
// This can be any of several ways; below I'll look
// it up by ID.
box = document.getElementById('theSelect');
if (box.addEventListener) {
// DOM2 standard
box.addEventListener("change", changeHandler, false);
}
else if (box.attachEvent) {
// IE fallback
box.attachEvent("onchange", changeHandler);
}
else {
// DOM0 fallback
box.onchange = changeHandler;
}
// Our handler
function changeHandler(event) {
var index, newValue;
// Get the current index
index = this.selectedIndex;
if (index >= 0 && this.options.length > index) {
// Get the new value
newValue = this.options[index].value;
}
// **Your code here**: old value is `oldValue`, new value is `newValue`
// Note that `newValue`` may well be undefined
display("Old value: " + oldValue);
display("New value: " + newValue);
// When done processing the change, remember the old value
oldValue = newValue;
}
(я предполагаю, что все вышеперечисленное находится внутри функции, как загрузка страницы)функция или аналогичная, как в живом примере , поэтому мы не создаем ненужные глобальные символы [box, oldValue, 'changeHandler`].)
Обратите внимание, что *Событие 1012 * вызывается разными браузерами в разное время.Некоторые браузеры вызывают событие, когда выбор изменяется, другие ждут, пока фокус не покинет поле выбора.
Но вы можете рассмотреть возможность использования такой библиотеки, как jQuery , Прототип , YUI , Закрытие или любой из нескольких других , поскольку они значительно облегчают эту работу.