2

簡単なDISCプロファイルテストを作成しています。各質問に8つのラジオボタンがあり、[M]ラジオボタンをオンにすると、[L]ラジオボタンが無効になり、選択できなくなります。次のようなものを選択する必要があります。圧倒的、親切、または勇敢。フォームは次のようになります、

ここに画像の説明を入力してください

私はjQueryを試していますが、

    $(document).ready(function(e) {
    var Form = $("[name=DISC]");

    Form.find("input.Most").each(function() {
        $(this).change(function() {
            $(this).next().attr("disabled", "disabled");
            $(this).prev().attr("disabled");
        });
    });

    Form.find("input.Least").each(function() {
        $(this).change(function() {
            $(this).prev().attr("disabled","disabled");
            $(this).next().attr("disabled");
        });
    });
});

しかし、Great "M"ラジオボタンをチェックし、後でそれをOverpowered Great "L"ラジオボタンに変更すると、他の "L"ボタンと同様に、後で "L"ボタンを変更すると、 「M」はまだ無効になっています。次のようになります。

ここに画像の説明を入力してください

私が得たい結果は、種類にMを選択した場合、種類にLを選択できないということです。何か助けはありますか？英語が下手でごめんなさい。:)

4

2 に答える 2

1

ボタンの2つのグループを作成します（つまり、ボタンに同じname属性を与えます）。デフォルトの動作では、各グループの1つのボタンのみを一度にチェックできます。

<div class="lgroup">
 <input type="radio" name="Lgroup" value="1"> //great
 <input type="radio" name="Lgroup" value="2"> //overpowered
 <input type="radio" name="Lgroup" value="3"> // kind 
 <input type="radio" name="Lgroup" value="4"> //brave  
</div>
<div class="mgroup">
 <input type="radio" name="Mgroup" value="1"> //great
 <input type="radio" name="Mgroup" value="2"> //overpowered
 <input type="radio" name="Mgroup" value="3"> //kind
 <input type="radio" name="Mgroup" value="4"> //brave
</div>

LとMとしてマークされている同じ属性を禁止するには、次のスクリプトを使用できます。

$("input").change(
    function(){
      i= $(this).index();
       sibling =  $(this)
        .parent()
        .siblings()
        .find("input")
        .eq(i);
     if (sibling.is(":checked")) 
         $(this).removeAttr("checked");
         }
);

フィドル

于 2013-01-19T11:25:33.497 に答える
0

あなたの質問への答えとして、私はちょうどこのフィドルを試しました：http: //jsfiddle.net/KXbEE/

使用されるHTML：

<form name='DISC' method='post'>
  <table>
    <tbody>
        <tr>
            <td>
                <input type='radio' name='' value='' />
                <input type='radio' name='' value='' />
            </td>
            <td>Great</td>
        </tr>
        <tr>
            <td>
                <input type='radio' name='' value='' />
                <input type='radio' name='' value='' />
            </td>
            <td>Overpowered</td>
        </tr>
        <tr>
            <td>
                <input type='radio' name='' value='' />
                <input type='radio' name='' value='' />
            </td>
            <td>Kind</td>
        </tr>
        <tr>
            <td>
                <input type='radio' name='' value='' />
                <input type='radio' name='' value='' />
            </td>
            <td>Brave</td>
        </tr>
    </tbody>
  </table>
</form>

そしてこのjQuery：

var Form = $("form[name='DISC']");

Form.find(":radio").each(function () {
    $(this).change(function () {
        $(this).siblings(':radio').attr("disabled", "disabled");
    });
});

これがあなたを助けるならば、これをチェックしてください。

于 2013-01-19T11:44:12.723 に答える