使用javascript将css应用于动态生成的单选按钮

时间:2012-06-19 12:57:21

标签: javascript firefox

您好我有一个生成单选按钮的javascript代码,如果需要也可以删除。         
    for(var i = 0; i< len; i ++){
        Node.childNodes [i] .innerHTML =“”;
    }

var Node1 = document.getElementById(tempArrIndex);        <br>
arrValueOptions = childValues[tempArrIndex["Values"].split(",");
for (var tempC2 = 0; tempC2 < arrValueOptions.length; tempC2++){
    var nameToUpdate = holdIDsToUpdate[tempCounter];
    var temp = tempC2 + 1;
    var idToUpdate = holdIDsToUpdate[tempCounter] + temp;
    var labelToUpdate = "";
    var defUpdater = "";
    if (arrValueOptions[tempC2] != ""){
        labelToUpdate = arrValueOptions[tempC2];
        if (childValues[tempArrIndex]["Default"] == labelToUpdate){
            defUpdater = 1;
        }
        var tbody = document.createElement('tbody');
        var row = document.createElement("tr");
        row.class = "test";
        var data1 = document.createElement("td");
        var newRadio = document.createElement("input");
        newRadio.type = "radio";
        newRadio.id = idToUpdate;
        newRadio.name = nameToUpdate;
        newRadio.value = labelToUpdate;
        if (defUpdater == 1){
            newRadio.setAttribute('checked', 'checked');
        }
        newRadio.setAttribute("onclick", "javascript:dependentFieldsValue('" + idToUpdate + "');");
        var data11 = document.createElement("td")
        var newLabel = document.createElement("label");
        newLabel.htmlFor = idToUpdate;
        newLabel.id = idToUpdate;
        newLabel.appendChild(document.createTextNode(labelToUpdate));
        tbody.appendChild(row);
        row.appendChild(data1);
        data1.appendChild(newRadio);
        row.appendChild(data11);
        data11.appendChild(newLabel);
        Node1.appendChild(row);
        defUpdater = 0;
    }
}

它工作正常,我需要做的是在组中的单选按钮之间创建间隙。因为他们彼此非常接近。任何人请帮忙。在IE中,Gap看起来不错,但在Firefox中没有。

2 个答案:

答案 0 :(得分:0)

可以通过一些CSS在td单元格上应用填充来获得间隙,例如,在td { padding: 0.5em 0 } 单元格中添加填充,例如

{{1}}

答案 1 :(得分:0)

在生成的单选按钮中添加一个类,如下所示:

newRadio.className = "myClass";

然后您可以将所有单选按钮添加到所有单选按钮中,如下所示:

.myClass {
    margin-left: 3px;
}