如何清除文本的文本字段中時，單選按鈕選擇

目前我有這個單選按鈕如何清除文本的文本字段中時，單選按鈕選擇

普電子
計算機
其他

我所試圖做的是，如果選中單選按鈕Others，我想顯示一個輸入文本字段並讓用戶輸入。

我想要做的是，當我選擇Others並鍵入輸入字段裏面的東西，然後當我選擇回Eletronics或Computers，我想清楚了，我輸入欄裏面寫的文字。

請給我提供JavaScript或jQuery的解決方案。

這是我的代碼示例。敬請檢查：http://jsfiddle.net/dnGKM/

來源

2012-04-24 spotlightsnap

UPDATE

$('input:radio').on('click', function() { 
    if($(this).attr('id') == 'others') { 
     $('#showhide').css('opacity', 1.0); 
    } else { 
     $('#showhide').css('opacity', 0).find('input:text#others_text').val(''); 
    } 
});

DEMO

來源

2012-04-24 10:26:07 thecodeparadox

當我通過POST提交結果時，總是空白:(..任何想法爲什麼？如果我刪除的是查找（'輸入：文本'）。val（''）的js代碼，數據提交正確，不是空白的數據了。解決方法？ – spotlightsnap 2012-04-25 05:20:55

@spotlightsnap檢查更新演示 – thecodeparadox 2012-04-25 05:40:23

謝謝，它現在的作品：D – spotlightsnap 2012-04-25 07:19:14

您可以使用此：

document.getElementById("others_text").value='';

清除輸入字段。

來源

2012-04-24 09:45:42 stewe

請在下面添加一行代碼代碼：

document.getElementById("others_text").value = '';

現在它的樣子：

document.getElementById("others").addEventListener("click", function() 
{ 
    document.getElementById("others_text").value = ''; 
    document.getElementById("showhide").style.opacity = 1; 
}, false); 
document.getElementById("computers").addEventListener("click", function() 
{ 
    document.getElementById("showhide").style.opacity = 0; 
}, false); 
document.getElementById("electronics").addEventListener("click", function() 
{ 
    document.getElementById("showhide").style.opacity = 0; 
}, false);

這將是對你有幫助。

來源

2012-04-24 09:47:16 Chandresh

問題，當我用POST提交表單時，我只能得到空白值。我選擇「其他」，但文本框內有輸入文本。 :(有沒有其他的方法可以清除文本？ – spotlightsnap 2012-04-25 04:52:31

你jQuery標記添加到您的問題，所以應該使用jQuery的:)

CSS做的伎倆：

.hidden { 
    display: none; 
}

HTML：

<label for="electronics">Electronics</label> 
<input type="radio" id="electronics" name="rdbutton" /> 
<label for="computers">Computers</label> 
<input type="radio" id="computers" name="rdbutton" /> 
<label for="others">Others</label> 
<input type="radio" id="others" name="rdbutton" /> 
<input type="text" id="others-text" name="others-text" class="hidden" />

JS：

$(function() { 
    $('input[type="radio"]').click(function() { 
     if($(this).attr('id') == 'others') { 
      $('#others-text').removeClass('hidden'); 
     } else { 
      $('#others-text').addClass('hidden'); 
      $('#others-text').val(''); 
     } 
    }); 
});

來源

2012-04-24 09:52:36 sp00m

我得到了一個錯誤：你不能改變「type」屬性 – Chinmaya003 2012-04-24 10:28:16

對不起，我的錯，我不知道那是被禁止的，剛編輯我的答案，我做了一個更常見的方式:) – sp00m 2012-04-24 11:27:13

當我通過POST提交結果時，其他文本框的結果總是空白:(..任何想法爲什麼？如果我刪除這是這樣的js代碼（$（'＃others-文本'）。val（''）;），數據被正確提交，而不是空白數據。解決方案的任何方式？ – spotlightsnap 2012-04-25 04:57:37

$("#<%=text1.ClientID%>").val('');

來源

2012-04-24 09:54:11 user335160

嘗試使用此解決方案：

$(function() { 
     $('input[type="radio"]').click(function() { 
     if($(this).attr('id') == 'others') { 
      $('#others-text').show(); 
     } else { 
      $('#others-text').hide(); 
      $('#others-text').val(''); 
     } 
    }); 
})

在這裏有一個的jsfiddle鏈接：

http://jsfiddle.net/dnGKM/4/

來源

2012-04-24 10:29:47 Chinmaya003

問題是，當我提交與POST表單，我只得到空白值。我選擇「其他」，但文本框內有輸入文本。 :(。有沒有其他的方式來清除文本？ – spotlightsnap 2012-04-25 04:53:00

我已經更新JSFiddle.See這個鏈接，如果它可以幫助你： http://jsfiddle.net/dnGKM/5/ – Chinmaya003 2012-04-25 05:37:38

=============== HTML

<input type="radio" name="rdo" value="1" checked="checked" />Electronics 
<input type="radio" name="rdo" value="2" />Computers 
<input type="radio" name="rdo" value="3" />Others

=============== jQuery的

$('input[name=rdo]').change(function() { 
     var a = $(this).val(); 
     if (a != 3) { 
      $('#textboxid').hide(); 
     }else{ 
      $('#textboxid').val(''); 
      $('#textboxid').show(); 
     } 
    });

來源

2012-12-27 06:17:10

它看起來簡單和容易.. – 2013-07-02 06:18:03

如何清除文本的文本字段中時，單選按鈕選擇

回答

相關問題