Question

首先我有一个剑道网格。现在我正在动态地向DataSource添加一个复选框，如下所示：

var chkBox =  "<input type='checkbox' id='chUpload'/><label for='chUpload'><a href='#' id='cbChoose'></a>test</label>";

var uploadedFiles = 
[
    { 
        facility: "Sunrise medical Laboratories", 
        documentName:  "Lab Results",
        documentType: "PDF",
        selected: chkBox
    }
];

以下是复选框上实施的样式：

input[type="checkbox"]
{
    display:none;
}

input[type="checkbox"] + label a
{
    display:inline-block;
    width:14px;
    height:14px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    background:url('../images/checkBox.png') right top no-repeat;
    cursor:pointer;
    float:right;
    margin-top:10px;
    margin-right:10px;
}

input[type="checkbox"]:checked + label a 
{
    background:url('../images/checkBox.png') -1px top no-repeat;
}

我发现这些样式适用于我添加到的其他复选框面板栏的选项卡，但在网格中，不显示任何内容。

我创建了一个jsfiddle，其中黑框是样式复选框。我已将display:none;隐藏在css中以查看所有文本框的位置。如果正在使用，则不会在网格中显示检查自定义框。

任何想法为什么？

Answer 1

我发现了问题。

template: "<input type='checkbox' style='margin-right:23px; margin-top:0px;'  />"

应该是：

template: "#= selected #"

这是我的一个简单错误。

这是一个有效的example。

Css - 复选框上的自定义样式不起作用

1 个答案: