單選按鈕和輸入字段

Question

我想設置一個表單，用戶可以從一組單選按鈕中進行選擇，如果他們不喜歡任何選擇，他們可以使用最後一個單選按鈕，該按鈕將具有文本字段輸入自定義文本。

我在幾個網站上看到過這個。只是想知道它在哪裏以及如何實施

Answer 1

我給你做了一個例子，這是你想要的嗎？ http://www.jsfiddle.net/T7gE7/

var temp = ''; 
function disableTxt() { 
    var field = document.getElementById("other"); 
    if(field.value != '') { 
     temp = field.value; 
    } 
    field.style.display = "none"; 
    field.value = ''; 
} 
function enableTxt() { 
    document.getElementById("other").style.display = "inline"; 
    document.getElementById("other").value = temp; 
} 

Answer 2

創建三個單選按鈕，然後您的輸入字段將輸入字段設置爲禁用。將一個JavaScript事件附加到調用JavaScript函數的第三個單選按鈕。此功能將啓用輸入欄，允許用戶輸入自己的選項。您還應該將JavaScript事件添加到其他兩個單選按鈕，以禁用輸入字段（如果它們被重新選擇）。

Answer 3

嗯@Dai比我快：P ...但無論如何，這是通過使用Mootools的（如果你不想混的JS和HTML代碼做同樣的事情，非侵入性的方式）

http://jsfiddle.net/raKbZ/1/

$('radio4').addEvent('change',function(E){ 
    if(E.target.checked){ 
     enableInput(); 
    } 
}); 

$$('.normal').each(function(radio){ 
    radio.addEvent('change',function(E){ 
     if(E.target.checked){ 
      disableInput(); 
     } 
    }); 
}); 


function enableInput(){ 
    $('other').set('disabled',''); 
    $('other').setStyle('background-color','#fff'); 
} 

function disableInput(){ 
    $('other').set('disabled','disabled'); 
    $('other').setStyle('background-color','#d4d4d4'); 
}