-1

クライアント用に作成しているフォームがあり、それを作成しようとしています。ラジオボタンの1つのグループが選択されている場合は、チェックボックスのリストを無効にしますが、チェックボックスのラジオボタンが選択されている場合は、他のラジオボタンをオフにします。それらは/選択されました。

これが私が使用しているコードです:

<form action="#">
<fieldset><legend>Activities</legend>
    <input style="margin-right:0; margin-left:0;" type="radio" id="Golf" value="I would like to golf at The Breakers Ocean Course" name="activity" />
    <label for="Golf">Golf - The Breakers Ocean Course</label>
    <ul style="margin-top:0;">
        <label for="club">Club Rental</label>
        <input style="margin-right:0; margin-left:0;" type="radio" id="club-yes" value="Yes" name="clubrental" />
        <label for="club-yes">Yes</label>
        or
        <input style="margin-right:0; margin-left:0;" type="radio" id="club-no" value="No" name="clubrental" />
        <label for="club-no">No</label><br>

        <input style="margin-right:0; margin-left:0;" type="radio" id="right-hand" value="Right Handed" name="clubhand" />
        <label for="right-hand">Right Handed</label>
        or
        <input style="margin-right:0; margin-left:0;" type="radio" id="left-hand" value="Left Handed" name="clubhand" />
        <label for="left-hand">Left Handed</label>
    </ul>
<div style="clear:both;">&nbsp;</div>
    <input style="margin-right:0; margin-left:0;" type="radio" id="hometour" value="I would like to take the Home tour and Worth Avenue Shopping" name="activity" />
    <label for="hometour">Home tour and Worth Avenue Shopping</label>
<div style="clear:both;">&nbsp;</div>
    <input style="margin-right:0; margin-left:0;" type="radio" id="museum" value="I would like to attend the Cars of Dreams Museum Tour" name="activity" />
    <label for="museum">Cars of Dreams Museum Tour</label> 
<div style="clear:both;">&nbsp;</div>
    <input style="margin-right:0; margin-left:0;" type="radio" id="spa" value="I would like to attend The Spa at the Breakers" name="activity" />
    <label for="spa">Spa - The Spa at the Breakers</label>  
        <ul style="margin-top:5px;">
            - Please select two treatments<br>
            <div style="float:left; width:220px; margin-right:15px;">
            <input type="checkbox" id="personal-retreat-massage" value="Personal Retreat Massage" name="treatment" onclick="setItems(this)">
            <label for="personal-retreat-massage">Personal Retreat Massage</label>
            </div>
            <div style="float:left; width:220px; margin-right:15px;">
            <input type="checkbox" id="simplicity-massage" value="Simplicity Massage" name="treatment" onclick="setItems(this)">
            <label for="simplicity-massage">Simplicity Massage</label>
            </div>
            <div style="float:left; width:220px; margin-right:15px;">
            <input type="checkbox" id="guerlain-classic-facial" value="Guerlain Classic Facial" name="treatment" onclick="setItems(this)">
            <label for="guerlain-classic-facial">Guerlain Classic Facial</label>
            </div>
            <div style="float:left; width:220px; margin-right:15px;">
            <input type="checkbox" id="cellular-enzyme-peel" value="Cellular Enzyme Peel" name="treatment" onclick="setItems(this)">
            <label for="cellular-enzyme-peel">Cellular Enzyme Peel</label>
            </div>
        </ul>
</fieldset>
    <center><input style="width:75px; height:25px; margin-bottom:25px;" type="submit" value="Submit" name="submit"></center>
</form

> PHPを使用できないため、これはJavascriptのみになります。

ありがとうございました。

4

1 に答える 1

0

スパラジオボタンが選択されていないときはチェックボックスを無効にし、選択されているときは有効にしてみてください。ラジオ要素のフォーカスの状態を確認できます。次のようなものがうまくいくと思います:

$('[type="radio"]').focus(function(){
    if ($('#spa').prop('checked')) {// jQuery 1.7.2
        $('[type="checkbox"]').removeAttr('disabled');
    } else {
        $('[type="checkbox"]').attr('disabled', 'disabled');
    }
})

それが役に立てば幸い!

jQuery のドキュメントをチェックしてください。彼らはとても役に立ちます!

http://api.jquery.com/

あなたの現在の状況で役立つかもしれないいくつかのことは次のとおりです。

http://api.jquery.com/attr/

http://api.jquery.com/removeAttr/

http://api.jquery.com/focus/

http://api.jquery.com/blur/

http://api.jquery.com/category/selectors/

于 2012-04-18T00:20:29.257 に答える