?

如果你看到這篇文章，甚至目前正愁于該問題的困擾，希望你把這篇文章看完。至少下次不會在這個問題上浪費時間。

近期做的項目中涉及到頁面控件是否可用，發現了一些有趣的東西，現來說說具體如下：

我有一個需求，就是點擊radiobutton1時textbox1控件可用，當點擊radiobutton2時textbox1不可用。當時以為javascript可以很簡單的就處理了這個問題，但發現并非如此。上網找了下資料可以了解到對于如：radiobutton、checkbox這樣的控件是否可用直接設置它們的disabled屬性為true,false即可。但像label，textbox這樣的控件如果這樣設置就不起作用了。

上網找了下資料發現http://blog.csdn.net/hzfu007/archive/2009/03/17/3998862.aspx 和我的問題很相像， 但這里僅僅說的是radiobutton這樣的控件是否可用，而我的控件是textbox。然后我就試圖修改它們的disabled為true或false 發現根本不好用。之后我就在后臺控制

??? protected void radiobutton1_CheckedChanged(object sender, EventArgs e)
??? {
??????? this.linkimg.Enabled = true;
??????? this.linkimg.BackColor = Color.White;
??? }
??? protected void radiobutton2_CheckedChanged(object sender, EventArgs e)
??? {
??????? this.linkimg.Enabled = false;
??????? this.linkimg.BackColor = Color.Silver;
??? }

這樣是可以實現的，在生成的源代碼中發現textbox不可用是設置了它的disabled屬性，只不過屬性值是"disabled" 而不是true或false 。那么有了disabled屬性當然應該有enabled屬性吧。因為不想回發（頁面刷新）實現這個功能，所以還得利用javascript

修改js為：

?????? if(document.getElementById('radiobutton1').checked==true)
??????? {
????????
??????? document.getElementById('textbox1').disabled="disabled"; //使控件不可用
??????? document.getElementById('textbox1').style.backgroundColor="#9c9c9c"; //背景色變灰
??????????????
??????? }
??????? if(document.getElementById('radiobutton2').checked==true)
??????? {
???????? document.getElementById('textbox1').enabled="enabled";?? //控件可用????? 或document.getElementById('textbox1').disabled="enabled"; //這樣也是不行的
???????? document.getElementById('textbox1').style.backgroundColor="#ffffff";
??????? }

問題又來了，點擊radiobutton1 可以使textbox不可用，但可用還是不行。紅色代碼根本不起作用。仔細觀察發現JS中控件根本沒有enabled屬性，這個屬性是后臺控件的屬性。并在源代碼中也發現控件不可用只是把該控件的disabled="disabled" 可用的話就是沒有disabled="disabled" 既然這樣那么我想去掉disabled="disabled"不就可以了么！

上網也找了好些資料發現JS去掉控件屬性是一件麻煩的事。后來我想到了幾個變通的方法來解決：

可以利用AJAX.NET無刷新來解決這個問題，但總覺得能用簡單的方法解決的問題，不用AJAX這個大家伙上陣，甚至我還想到了利用JS的創建刪除元素的方法。思路是這樣的：首先點擊radiobutton1控件使控件不可用，當點擊 radiobutton2的時候利用removeChild刪除不可用的textbox之后立馬用createElement在原來位置創建一個textbox。屬性都設置好。做到了無刷新，對于用戶是不可見的，他們以為是實現了效果，其實是刪除了原有的不可用控件之后，再生成一個可用的控件。 但仔細想想這些方法有點小題大作。問題應該可以解決，只不過沒有找對方法。

忽然間我靈感來了，如果“取反”會怎樣呢？沒想到這下成功了。代碼如下：

?????? if(document.getElementById('radiobutton1').checked==true)
??????? {
????????
??????? document.getElementById('textbox1').disabled="disabled"; //使控件不可用
??????? document.getElementById('textbox1').style.backgroundColor="#9c9c9c"; //背景色變灰
??????????????
??????? }
??????? if(document.getElementById('radiobutton2').checked==true)
??????? {
??????? document.getElementById('textbox1').disabled=!document.getElementById('textbox1').disabled//使控件可用
??????? document.getElementById('textbox1').style.backgroundColor="#ffffff";

??????? }

哈哈終于讓我解決了。說了那么多廢話，總結一下吧；

如果想利用JS更改控件是否可用 radiobutton、checkbox這樣的控件 設置它們的disabled 為true或false即可，lable或textbox這樣的控件則設置disabled屬性。只不過不可用為"false"??? 可用“取反”即=!document.getElementById('textbox1').disabled;