gpt4 book ai didi

javascript - 元素javascript的读取宽度

转载 作者:太空宇宙 更新时间:2023-11-04 05:03:13 25 4
gpt4 key购买 nike

我正在尝试读取一个元素的宽度,然后将另一个元素的宽度设置为等于该宽度。出于某种原因,javascript 没有正确读取宽度,但我不确定为什么。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link href="../StyleSheet.css" rel="stylesheet" type="text/css" />
<link href="iflyreader.css" rel="stylesheet" type="text/css" />
<title></title>


<script type="text/javascript">
function setCommentWidth() {

var comment = document.getElementById("comments");
var pleft = document.getElementById("leftcontainer");
alert(pleft.style.width.toString());
comment.style.width = parseInt(pleft.style.width) * 2;

}


</script>
</head>
<body onclick="setCommentWidth()" >

<form id="form1" runat="server">
<div id = "container" >
<h2> Ifly Checkin Sheet</h2>


<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<div class="row">

<div class="rowcontainer" id ="leftcontainer">
<p class="left">Last Name: <%# DataBinder.Eval(Container.DataItem, "lastname") %> </p>
<p class="left">First Name: <%# DataBinder.Eval(Container.DataItem, "firstname") %> </p>
<p class="left">Date: <%# DataBinder.Eval(Container.DataItem, "timestamp") %></p></div>
<div class="rowcontainer"> <p class="right">Member Number: <%# DataBinder.Eval(Container.DataItem, "memnum") %> </p>
<p class="right">Facility: <%# DataBinder.Eval(Container.DataItem, "facility") %> </p>
<p class="right">Reason: <%# DataBinder.Eval(Container.DataItem, "reason") %> </p></div>

<p id="comments" >Comments: <%# DataBinder.Eval(Container.DataItem, "comments") %></p>
</div>
</ItemTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>

我认为这可能与我的 css 声明值有关,但我不确定。这是我的样式表。

body
{
background-color: #fff;
}


.cell {
display:inline-block;
margin-left:5px;
margin-right:5px;
padding:5px;
width: 100px;

}

.row
{
margin: 10px;
padding: 10px;
display: inline-block;
background-color: #888;
border-radius: 5px;

}

#container
{
margin-left: auto;
margin-right: auto;
width : 900px;

background-color: #fefefe;
padding: 50px;

}

p
{


font-weight: bold ;
color: #fff;



}


p.left
{
text-align: left;
width: auto;

}

p.right
{
text-align: right;
width: auto;

}


.rowcontainer
{
display: inline-block;
}

最佳答案

试试 offsetWidth。

function setCommentWidth() {

var comment = document.getElementById("comments");
var pleft = document.getElementById("leftcontainer");
alert(pleft.offsetWidth);
comment.style.width = parseInt(pleft.offsetWidth) * 2;

}

关于javascript - 元素javascript的读取宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11053086/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com