无法在javascript中增加动态创建标签的宽度?

时间:2011-12-05 12:27:34

标签: javascript html

我有一个问题,我正在尝试动态创建标签并设置textarea的文本,但问题是我无法通过javascript动态增加标签的大小,我发布了两个html和javascript代码如下: -

的javascript

function createLabel(){
    var lbl = document.createElement("label");
    lbl.id = "label2";
    var tr = document.createElement("tr");
    var lblText = document.getElementById("postbox").value;
    lbl.innerHTML = lblText;
    lbl.style.display = "block";
    tr.appendChild(lbl);
    tr.style.display = "block";
    document.getElementById("postTd").appendChild(tr);
    $("#label2").css("width", "50px;")
}

html: -

<div id="wrapper">
<a href="profile.php"><label id="label1" style="cursor:pointer;"><?php echo user_details('username'); ?></label></a>
<textarea id="postbox" rows="4" style="position: absolute; resize:none; margin-left:450px; margin-top:70px;" cols="70"></textarea>
<input type="submit" onclick="createLabel()" value="Post" style="position: absolute; margin-top:150px; margin-left:990px;" name="submit" />
<div id="hrln1" style="position:absolute; margin-top:150px; width:1050px; margin-left:0px;"><hr /></div>
<div id="postContainer">

    <table id="postTable">
    <td id="postTd">

    </td>        
    </table>

</div>

1 个答案:

答案 0 :(得分:2)

您正在将标签的显示模式设置为inline,因此它将忽略您在其上设置的任何宽度(无论是使用脚本还是CSS设置)

要正确服从宽度的元素,必须将其设置为display:blockdisplay:inline-block