更改单选按钮图像，帮助

嘿家伙。我不是一个程序员，但仍需要做一些编码。更改单选按钮图像，帮助

现在我遇到了用jQuery改变Radio Button Image的问题。我有这个网络代码，但它仍然无法正常工作。它改变了单选按钮图像，但是当我尝试选择，它改变了第一个单选框的只有图片（每次）

这里是我的HTML代码：

<div id="testcontent"> 
<div class="questions"> 
<div id="question0" class="question"> 
<span class="qutitle">asdg asdg</span> 
<FIELDSET class="radios"> 
<label for="q_0" class="label_radio"> 
<input id="q_0" type="radio" name="q_0" value="2">dgasdg 
</label> 
<label for="q_0" class="label_radio"> 
<input id="q_0" type="radio" name="q_0" value="0"> sdgas 
</label> 
<label for="q_0" class="label_radio"> 
<input id="q_0" type="radio" name="q_0" value="1">dgas 
</label> 
</FIELDSET> 
</div>

这里的CSS。我希望我说得对。

#testcontent .label_check, 
#testcontent .label_radio { padding-left: 34px; } 
#testcontent .label_radio { background: url(radio-off.png) no-repeat; } 
#testcontent .label_check { background: url(check-off.png) no-repeat; } 
#testcontent label.c_on  { background: url(check-on.png) no-repeat; } 
#testcontent label.r_on  { background: url(radio-on.png) no-repeat; } 
#testcontent .label_check input, 
#testcontent .label_radio input { position: absolute; left: -9999px; }

这里是jQuery代码。

function setupLabel() { 
     if ($('.label_check input').length) { 
      $('.label_check').each(function(){ 
       $(this).removeClass('c_on'); 
      }); 
      $('.label_check input:checked').each(function(){ 
       $(this).parent('label').addClass('c_on'); 
      });     
     }; 
     if ($('.label_radio input').length) { 
      $('.label_radio').each(function(){ 
       $(this).removeClass('r_on'); 
      }); 
      $('.label_radio input:checked').each(function(){ 
       $(this).parent('label').addClass('r_on'); 
      }); 
     }; 
    }; 
    $(document).ready(function(){ 
     $('.label_check, .label_radio').click(function(){ 
      setupLabel(); 
     }); 
     setupLabel(); 
    });

请告诉我这段代码有什么问题，非常感谢。

谢谢。

来源

2010-08-12 Bndr

我真的推荐使用jquery.uniform（因为您已经在使用jQuery或任何相同的替代选项）对复选框，广播和选择等表单元素进行造型。除了将图片放置在“真实”形式元素上方之外，还有很多其他功能，比如处理标签上的点击等。

来源

2010-08-13 10:19:56 benzimmer

谢谢，这很容易。 – Bndr 2010-08-17 13:43:13

如果您使用的是jquery.uniform，那么选择无线电动态按钮。

在设置了表单元素的值之后，例如

$("[name='buttongroup']['value='male']").attr("checked", true);

...只需做以下更新单选按钮选择的显示：

$.uniform.update();

来源

2011-02-24 08:55:39

你的问题是，你正在使用相同ID的所有输入和ID是唯一。这就是为什么它改变了ID =“q_0”的第一个实例

来源

2013-07-11 07:26:18

更改单选按钮图像，帮助

回答

相关问题