Question

我正在使用这个非常酷的库来修改传统的RadioButtonLists。
Image Tick V 2.0但我如何使用它来播放多个RadioButtonList，如下所示

O option1 (Checked)
O option2
O option3
O option4

O option1 (checked)
O option2
O option3
O option4

尝试使用不同的“Name”和“id”属性。到目前为止，能够呈现两个列表，但在点击它们之后（这里是第一个列表中的Option3），列表开始作为一个列表如下所示

O option1 
O option2
O option3 (checked)
O option4

O option1 
O option2
O option3
O option4

就像脚本开始将列表视为单个列表一样。有任何方向继续前进吗？
更新了我的小提琴链接
http://jsfiddle.net/skriyas/mctcs/236/

Answer 1

根据图片勾选示例。只需确保每个人都按名称对收音机输入按钮进行分组。然后在脚本中你应该有这样的代码。

$("input:radio").imageTick({ // target all the radio buttons instead of selecting by name
    tick_image_path: "images/radio.gif",  // the image you want to use as a selected state of the radio/checkbox
    no_tick_image_path: "images/no_radio.gif", // image you want to use as a non selected state
    image_tick_class: "radios" // the class you want to apply to all images that are dynamically created
});

在他们的示例中，他们按名称选择了无线电元素，因此如果您复制了该代码，则必须为每个组多次复制/粘贴代码

编辑：

在您的脚本中，您不会检查它们是否在同一组中。我在这里用支票更新了小提琴，它现在可以正常工作。使用过滤器可能有更好的方法，但我还不太满意。
http://jsfiddle.net/mctcs/237/

$("#tick_img_"+id).click(function(){
            var thisGroup=$(this).next('input').attr('name');   // This is the clicked group         
                $("." + opt.image_tick_class).each(function() { 
                    if($(this).next('input').attr('name') === thisGroup){ // check to only modify clicked gruop
                    //console.log($(this).attr('name'));
                    var r = this.id.split("_");
                    var radio_id = r.splice(2,r.length-2).join("_");
                    $(this).attr('src', no_tick_image_path(radio_id));
                    }
                });
                $("#" + id).trigger("click");

                $(this).attr('src', tick_image_path);

 });

使用Image Tick jQuery for Multiple RadioButtonList

1 个答案: