-1

フォームのラジオ ボタンのいずれかをクリックするまで、送信ボタンを「非アクティブ」にしたいのですが、クリックすると、ボタンは背景画像を button.png から button_active.png に変更します。

これはCSSだけでできますか？または、jquery/javascriptを含める必要がありますか? どうすればいいですか？

<input id="1" type="radio" name="1" value="1" />
<input id="2" type="radio" name="2" value="2" />
<input type="submit" name="submit" value="valj"  />
4

2 に答える 2

8

送信ボタンを無効にして開始できます。

<input id="1" type="radio" name="1" value="1" />
<input id="2" type="radio" name="2" value="2" />
<input type="submit" disabled name="submit" value="valj"  />

次に、スクリプトを使用してラジオ ボタンの変更イベントにバインドし、それらの値を調べて、必要に応じて無効化された属性を削除します。

// cache reference to all radio buttons.
var $radioButtons = $("input:radio");

$radioButtons.change(function(){
    var anyRadioButtonHasValue = false;

    // iterate through all radio buttons
    $radioButtons.each(function(){
        if(this.checked){
            // indicate we found a radio button which has a value
            anyRadioButtonHasValue = true;

            // break out of each loop
            return false;
        }
    });

    // check if we found any radio button which has a value
    if(anyRadioButtonHasValue){
        // enable submit button.
        $("input[name='submit']").removeAttr("disabled");
    }
    else{
        // else is kind of redundant unless you somehow can clear the radio button value
        $("input[name='submit']").attr("disabled", "");
    }
});

DEMO - ラジオ ボタンが選択されている場合、ボタンを有効にします。

于 2013-02-04T22:30:20.763 に答える
1

ボタンを無効にして開始し、ラジオ ボタンのいずれかが選択されている場合は有効にします。

<input id="1" type="radio" name="1" value="1" onClick="document.getElementById('subutton').disabled = false" />
<input id="2" type="radio" name="2" value="2" onClick="document.getElementById('subutton').disabled = false" />
<input id="subutton" type="submit" name="submit" value="valj" disabled/>
于 2013-02-04T22:22:55.287 に答える