勾選時激活input 否則禁用的javascript代碼
更新時間:2009年12月10日 23:46:04 作者:
唯一的可去之外是加了一點美化,使用戶體驗更加一層樓,其中包括邊框的加粗,焦點的獲取,checkbox邊框線的隱藏等等。
復(fù)制代碼 代碼如下:
window.onload = function(){
var price = document.getElementById('price');
price.disabled = true;
price.style.padding = '2px 3px';
price.style.background = '#eee';
price.style.border = '1px solid #ccc';
var tj = document.getElementById('tj');
tj.onclick = function(){
if(tj.checked == true){ //可編輯
price.disabled = false;
price.style.background = '#fff';
price.style.border = '2px solid #ff7d00';
price.style.padding = '2px 3px';
price.focus();
} else {
price.disabled = true;
price.style.background = '#eee';
price.style.border = '1px solid #ccc';
price.style.padding = '2px 3px';
}
}
}
復(fù)制代碼 代碼如下:
<form action="#">
價格:<input id="price" type="text"> <input id="tj" hidefocus=true type="checkbox">特價
</form>
唯一的可去之外是加了一點美化,使用戶體驗更加一層樓,其中包括邊框的加粗,焦點的獲取,checkbox邊框線的隱藏等等。
測試代碼
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
js實現(xiàn)的的 文字自動''到google search框
js實現(xiàn)的的 文字自動''到google search框...2007-05-05javascript select控件間內(nèi)容互相移動
javascript select中內(nèi)容互相移動2009-11-11select列表內(nèi)容交換的js實現(xiàn)代碼
js實現(xiàn)左右select列表內(nèi)容交換傳遞,原來就是先獲取當(dāng)期選中select的值,然后添加到對面的select中,然后刪除選中內(nèi)容。2009-12-12