0

たとえば、ラジオボタンに基づいて入力したいコンテンツがあるとします。たとえば、1つをクリックするradiobuttonと、3つtextareaのs（またはinputs）がアクティブになり、それらと他のラジオボタンに「属する」テキストエリアに入力できます、非アクティブになり、入力できなくなり、その逆も同様です。

<form>
    <input type="radio" name="group1" value="1"> val1<br> 

    <input type="radio" name="group1" value="2" checked> val2<br>

    <input type="text" value="123123" id="id1">
    <input type="text" value="123123" id="id2">
    <input type="text" value="123123" id="id3">
    <input type="text" value="123123" id="id4">
</form>

問題は、有効な val1 ラジオボタンで入力 id1、id2、id3 を有効にし、val2 で id4 を有効にして id1、id2、id3 を無効にする方法です。

4

6 に答える 6

2

これを試してください - http://jsfiddle.net/h7ZYY/

$("input:text").prop("disabled", true);
$("input:radio").on("click", function() {
    $("input:text").prop("disabled", true);
    $("input.group" + $(this).val()).prop("disabled", false);
});
于 2012-07-24T13:54:46.303 に答える
2

これを試して：

$('input[name=group1]').change(function(){
    if (this.value == 1) {
       $('#id1, #id2, #id3').prop('disabled', false)
       $('#id4').prop('disabled', true)
    } else {
       $('#id1, #id2, #id3').prop('disabled', true)
       $('#id4').prop('disabled', false)
    }
})

デモ

于 2012-07-24T13:56:25.647 に答える
1

すべての入力を無効にすることができます<input type="text" value="123123" id="id1" disabled="disabled">

そして、Javascript を使用すると、次のことができます。

<script>
function disable(input)
{
if (input == "2")
{
document.getElementById('id1').disabled = true;
document.getElementById('id2').disabled = true;
document.getElementById('id3').disabled = true;
document.getElementById('id4').disabled = false;
}
else
{
document.getElementById('id1').disabled = false;
document.getElementById('id2').disabled = false;
document.getElementById('id3').disabled = false;
document.getElementById('id4').disabled = true;
}
}
</script>

<form>
    <input type="radio" name="group1" value="1" onclick='disable('1');'> val1<br> 

    <input type="radio" name="group1" value="2" onclick='disable('2')'> val2<br>

    <input type="text" value="123123" id="id1" disabled="disabled">
    <input type="text" value="123123" id="id2" disabled="disabled">
    <input type="text" value="123123" id="id3" disabled="disabled">
    <input type="text" value="123123" id="id4" disabled="disabled">
</form>
于 2012-07-24T13:52:03.660 に答える
1

あなたが書くことができるテキストボックスを無効にするには、

   document.getElementById(textBoxID).disabled = True/False

明らかに、onclickイベントが必要です。

<input type="radio" name="group1" value="1" onclick ="EnableDisable(this);">
function EnableDisable(e) {
      $('text1').attr("disabled", !e.checked);
  }
于 2012-07-24T13:54:39.597 に答える
1

textareas/inputs を div の下の特定のラジオ ボタンにグループ化して、簡単に選択できるようにし、ラジオ ボタンに関連付けることができる id を div に与えます (ここで、私の Div id は次の形式になっています)。"area-"+ radioButtonValue 

<input type="radio" name="group1" value="1"> val1<br>
<input type="radio" name="group1" value="2"> val2<br>

<div  id="area-1" class="area">
    <input type="text" value="123123" id="id1">
    <input type="text" value="123123" id="id2">
    <input type="text" value="123123" id="id3">
</div>
<div id="area-2"  class="area">    
    <p>Selcond</p>
    <input type="text" value="123123" id="id4">
</div>

そしてスクリプトは

$(function(){
   $("div.area").hide();
    $("input[type=radio]").click(function(){        
      var val=$(this).val();
      $(".area").hide();    
      $("#area-"+val).show();        
    });      
});

これは、命名規則に従ってラジオ ボタンをその領域に関連付ける限り、n 個のラジオ ボタンとその領域 (textarea/input/other 要素を含む) に対して機能します。

作業サンプル: http://jsfiddle.net/zSeYW/

于 2012-07-24T13:54:54.967 に答える
0

あなたはイベントであなたが望むすべてを作ることができます：

onChange="myJQueryFunction()"

入力ラジオで

あなたがしなければならない後：

$('id').attr('disabled','disabled');

また：

$('id').removeAttr('disabled');

jqueryコードで

于 2012-07-24T13:47:00.283 に答える