Question

遇到以下代码问题。它在Chrome浏览器中运行良好，但不适用于Firefox或IE。基本上我要做的是改变图像以显示圆角或方角，具体取决于用户从单选按钮选项中选择的内容。

这是我的代码：

// set corner style  
    $(".productOptionViewRadio").click(function(){    
       var span_html = $(event.target).next().html();       

       if (span_html == 'Rounded') {
          $('.ProductThumbImage').css('border-radius','15px');             
          $('.ProductThumbImage img').css('border-radius','15px');
       }
       if (span_html == 'Square') { 
          $('.ProductThumbImage').css('border-radius','0px');   
          $('.ProductThumbImage img').css('border-radius','0px');
       }
    });

我正在使用的HTML代码源：

<div class="productAttributeValue">
    <div class="productOptionViewRadio">
        <ul>
         <li>
             <label>
             <input type="radio" class="validation" name="attribute[238]" value="125" checked="checked"/>
             <span class="name">Rounded</span>
         </label>
         </li>
             <li>
                 <label>
             <input type="radio" class="validation" name="attribute[238]" value="126"/>
             <span class="name">Square</span>
        </label>
             </li>
    </ul>
    </div>  
</div>

提前感谢您的帮助。

Answer 1

尝试将jQuery的前两行更改为：

$(".productOptionViewRadio input").click(function () {
    var span_html = $(this).next().html();

现场演示，显示正在提醒的正确跨度内容：http://jsfiddle.net/Czk2H/

Jquery单选按钮代码适用于Chrome，但不适用于Firefox或IE

1 个答案: