0

これまでの私のコードは次のとおりです。

http://jsfiddle.net/pRXxT/

ラジオ ボックスを選択すると、画像がその色で更新されるようにしようとしていますが、1 つではなく 2 つのラジオ ボックスが表示されます。

各ラジオ ボックスにはファイル名の別の部分があるため、最終結果は次のようになります。

http://blahblah/images/[radiobox1][radiobox2].jpg

私はこれで一日中遊んでいて、助けが必要です。私のコードは、さまざまなことを試したために少し乱雑になりました。CSS セクションの最初の画像のみを更新できたコードは、失われないように残しました。

ありがとう

4

1 に答える 1

2

あなたのコードは少し乱雑で、あなたが何を望んでいるのかを理解するのに少し時間がかかりました.jqueryセレクターにいくつかの大きな間違いがあるので、ここにいくつかの修正があります.これはうまくいくと思います:

HTML:

<input type="radio" class="radio1" name="BodyColor" value="blk"/> Black<br/>
<input type="radio" class="radio1" name="BodyColor" value="green"/> Green<br/>
<input type="radio" class="radio1" name="BodyColor" value="yellow"/> Yellow<br/>

<input type="radio" class="radio2" name="InsertColor" value="red"/> Red<br/>
<input type="radio" class="radio2" name="InsertColor" value="green"/> Green<br/>
<input type="radio" class="radio2" name="InsertColor" value="yellow"/> Yellow<br/>

<img src="blkblk.jpg" id="FinalImage" height="100px" width="100px">

JavaScript:

$(document).ready(function() {
    var BodyColor = 'blk';
    var InsertColor = 'blk';

    $(".radio1").click(function() {
        BodyColor = $(this).attr('value');
        updateImage();
    });
    $(".radio2").click(function() {
        InsertColor = $(this).attr('value');
        updateImage();
    });

    function updateImage() 
    { 
        //i don't know the uri you actually want so i'm gonna leave it like it is
        $("#FinalImage").attr('src', BodyColor + InsertColor + ".jpg");
    }

});

編集はテスト済みで正常に動作します

于 2012-04-30T18:33:44.393 に答える