0

使用 xml 读取特定事物的内容，我正在添加复选框及其描述。但问题是我想要像单选按钮一样看到我的复选框，但它应该像复选框一样工作。我的意思是我可以检查和取消选中它。此外，在空间勾选（在复选框中），它应该是点（如果可能，可以是任何颜色）。

$(xml).find("Layer[Name='"+layerName+"']").find("IndustryComponent").each(function()
            {
                var layerDesciption= $(this).attr('Name');
                if($(this).is(':empty'))
                {
                    $(".InsideLayerContainer").append("<input type='checkbox' name='' value='' disabled='true'><label>"+layerDesciption+"</label><br/>");   
                }
                else
                {
                    $(".InsideLayerContainer").append("<input type='checkbox' name='' value=''><label>"+layerDesciption+"</label><br/>");
                }
            });
4

3 回答 3

1

更新

检查此演示http://jsfiddle.net/yeyene/Xqr4n/2/

HTML

<input class="myCheck" type="checkbox" name="vehicle" value="Bike">check 1<br />
<input class="myCheck" type="checkbox" name="vehicle" value="Bike">check 2<br />
<input class="myCheck" type="checkbox" name="vehicle" value="Bike">check 3<br />

查询

$('input[type=checkbox]').each(function(){
    $(this).wrap('<span class="circle">');
});

$('.circle').on("click", function(){
    if($(this).css("background-color") == 'rgb(223, 223, 223)') { 
        $(this).find('.myCheck').prop('checked', true);
        $(this).css({'background-color':'rgb(0, 64, 212)'});
    }
    else {
        $(this).find('.myCheck').prop('checked', false);
        $(this).css({'background-color':'rgb(223, 223, 223)'});
    }
});
于 2013-06-19T06:56:09.100 回答
0

您需要为此使用图像叠加层。

创建两个图像，一个用于未选中视图，一个用于选中视图，然后根据点击值更新隐藏复选框并更改可见图像

于 2013-06-19T06:21:55.580 回答
0

我不会真的推荐它，但你总是可以让单选按钮像复选框一样工作，如果那是你真正想要的？

$('input[type="radio"]').on('click', function() {
    this.checked = !$(this).data('checked')
    $(this).data('checked', !$(this).data('checked'));
});

小提琴

于 2013-06-19T06:34:37.097 回答