-1

これは私のHTMLです：

<div class="sss">
    <label class="label_radio" for="radio-01">
        <input name="vtip" id="radio-01" value="50" type="radio" />
        <img src="http://www.tui-travelcenter.ro/layouts/innobyte/images/radio_50.jpg" width="199" height="241" style="display:block">
    </label>
</div>
<div class="ddd">
    <label class="label_radio1" for="radio-02">
        <input name="vtip" id="radio-02" value="100" type="radio" />
        <img src="http://www.tui-travelcenter.ro/layouts/innobyte/images/radio_100.jpg" width="199" height="241" style="display:block">
    </label>
 </div>
 <div class="clear"></div>

そして、これは私のjavascriptです:

$(document).ready(function () {
    $('#radio-01').change(function(){ 
        $(".label_radio").css({background: "#fff"});                           
        $(".label_radio1").css({background: "#fff"});                                   

        if($(this).is(":checked")) {                                                  
             $(".label_radio").css({background: "#000"});       
        } else {
         $(".label_radio").css({background: "#f00"}) ;          
        }
     });

     $('#radio-02').change(function(){                                 
        $(".label_radio").css({background: "#fff"});                                                          
        $(".label_radio1").css({background: "#fff"}); 

        if($(this).is(":checked")) $(".label_radio1").css({background: "#000"}); 
        else $(".label_radio1").css({background: "#fff"}) ; 
     });
 });

カスタム イメージを持つ 2 つのラジオ ボタンがあります。クリックすると背景が変わるので、選択されていることがわかります。(ここにライブがあります: tui-travelcenter.ro/concurs_voucher.php - 2 枚の写真。) これは Firefox、Chrome では問題なく動作しますが、IE では動作しません。

4

1 に答える 1

1

これを IE で機能させるには、コード内で$(".label_radio1").css({'background-color': "#fff"});代わりに使用$(".label_radio1").css({background: "#fff"});します。

あなたが電話をかけるすべての場所で同じことをしてください.css(..)

編集

IE では、クリック イベントは img からラベルに UP を伝播しないため、ラジオ (ラベルである) に影響を与え、ラジオの変更イベントをトリガーします。このコードを JS に追加して、イベントの伝播を強制します。

$('label img').click(function() {
    $(this).prev('input').attr('checked', true).change();
    return true;
});
于 2012-05-23T11:21:01.487 に答える