2009/07/24

解決ie6,ie7的select option disabled沒有作用的問題 Select, Option, Disabled And The JavaScript Solution In IE7, IE6, IE5.5

解決方案:
http://www.lattimore.id.au/2005/07/01/select-option-disabled-and-the-javascript-solution/

下載js檔, 並include到頁面即可, 作法是把頁面的select element找出來, 判斷有disabled的option就變顏色且不可選擇
http://www.lattimore.id.au/files/examples/select-option-disabled-emulation.js

因為只有在ie7以下的版本有問題, 其他瀏覽器沒問題, 所以我改寫了一下
if (navigator.appVersion.indexOf("MSIE 5.5") >= 0 || navigator.appVersion.indexOf("MSIE 6.0") >= 0 || navigator.appVersion.indexOf("MSIE 7.0") >= 0) {
window.onload = ReloadSelectElement;
}
function ReloadSelectElement() {
if (document.getElementsByTagName) {
var s = document.getElementsByTagName("select");
if (s.length > 0) {
window.select_current = new Array();
for (var i = 0, select; select = s[i]; i++) {
select.onfocus = function() { window.select_current[this.id] = this.selectedIndex; }
select.onchange = function() { restore(this); }
emulate(select);
}
}
}
}
function restore(e) {
if (e.options[e.selectedIndex].disabled) {
e.selectedIndex = window.select_current[e.id];
}
}
function emulate(e) {
for (var i = 0, option; option = e.options[i]; i++) {
if (option.disabled) {
option.style.color = "graytext";
}
else {
option.style.color = "menutext";
}
}
}

沒有留言:

軟體工程的重要的指標