在代码中未指定时,在代码后面获取锚高度和宽度?

时间:2012-01-26 16:19:14

标签: asp.net html anchor

我有一个锚点设置显示:内联块,它像我想要的那样环绕文本,没有指定高度或宽度。现在我需要从我的代码隐藏中获得这个宽度和高度。

有人可以向我解释如何获取这些值,即使它们未被指定并仅仅从文本的宽度/高度继承而来?

更新:找到解决方案

这可以使用元素的JavaScript属性offsetHeight和offsetWidth来完成。这是我在哈希中放在一起的代码:

JS:

<script language="javascript" type="text/javascript">
  function GetAnchorSize() {
        var buttonWidth = document.getElementById('<%= button.ClientID %>').offsetWidth;
        var buttonHeight = document.getElementById('<%= button.ClientID %>').offsetHeight;
        document.getElementById('<%= buttonWidth.ClientID %>').value = buttonWidth;
        document.getElementById('<%= buttonHeight.ClientID %>').value = buttonHeight;
    }
 </script>

我需要大小的元素和两个输入值的隐藏字段:

<input type="hidden" id="buttonWidth" runat="server" />
<input type="hidden" id="buttonHeight" runat="server" />

<a id="button" href="#"  onmousemove="GetAnchorSize();"  runat="server" 
                    style="display: inline-block; border-color: Black;
                    text-decoration: none; border-style: solid; border-width: 1px; background-repeat:no-repeat;">Text</a>

我进行了设置,以便在鼠标移动时进行更新,您可以将其设置为需要更新值的事件。

在codebehind中获取值:

int btnWidth = Convert.ToInt32(buttonWidth.Value);
int btnHeight= Convert.ToInt32(buttonHeight.Value);

3 个答案:

答案 0 :(得分:0)

如果我理解正确,您需要将“runat = server”添加到相关元素中。另外,不要忘记为其分配ID。之后,您应该能够在C#中访问它。

希望这有帮助!

答案 1 :(得分:0)

我认为你应该尝试仅在客户端处理表示问题,但如果你真的需要检索这些值,我认为你应该使用隐藏字段,并在PostBack上获得它的价值。

确保您的元素(A,DIV等)可见,否则您可能会得到错误的值。

将值放在隐藏字段中:

<input type="hidden" id="elSize" runat="server" />

然后检索代码隐藏中的值:

elSize.Value

如果使用jQuery,则可以轻松地检索大小:使用width()和height()(如果需要margin / border / padding,则使用outerWidth和outerHeight)。

使用纯JavaScript,我应该能够使用ClientWidth和ClientHeight。

编辑:将隐藏的字段放在ContentTemplate标记内。

<asp:UpdatePanel ID="upTripsGrid" runat="server" UpdateMode="Always">
    <ContentTemplate>
        <input type="hidden" runat="server" id="hidCurrentDate" value="" />

来源:Problem - any hidden field in Update Panel does not get updated

答案 2 :(得分:0)

这里的问题是,由于这个元素紧紧围绕文本,它的大小取决于文本的大小......文本的大小取决于浏览器窗口的大小和缩放。因此,元素的大小取决于浏览器窗口的大小,并且您无法知道此项在浏览器呈现之前的大小。

这里最好的解决方案是在javascript中实现你想要做的任何事情,这可以很容易地向浏览器DOM询问元素的大小。

如果这根本不是一个选项,那么您可以希望的第二个最好的事情是在第一次回发后记录此服务器端(并在每个帖子上观看它,因为如果用户重新调整其浏览器的大小,这将会改变窗口)。