Получить высоту и ширину якоря в коде позади, когда они не указаны в коде? - PullRequest
Новая
       11

Получить высоту и ширину якоря в коде позади, когда они не указаны в коде?

0 голосов
/ 26 января 2012

У меня есть привязка для отображения: inline-block, и она обтягивает текст так, как я хочу, без указания высоты или ширины.Теперь мне нужно получить эту ширину и высоту из моего кода.

Может кто-нибудь объяснить мне, как я могу получить эти значения, даже если они не указаны и просто унаследованы от ширины / высоты текста внутри?

ОБНОВЛЕНИЕ: найденное решение

Это можно сделать с помощью свойства 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>

Я настроил его так, чтобы он обновлялся при перемещении мыши, чтобы вы могли настраивать, для какого события вам нужно обновлять значения.

И чтобы получить значения в коде: 

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

Ответы [ 3 ]

0 голосов
/ 26 января 2012

Я думаю, что вы должны попытаться решить проблемы с презентациями только на стороне клиента, но если вам действительно нужно получить эти значения, я думаю, вам следует использовать скрытое поле и получить его значение в PostBack.

Убедитесь, что ваш элемент (A, DIV и т. Д.) Виден, иначе вы можете получить неправильные значения.

Поместите значения в скрытое поле: 

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

Затем извлеките значениев вашем программном коде: 

elSize.Value

Если вы используете jQuery, легко получить размер: используйте width () и height () (или outerWidth и outerHeight, если вы хотите margin / border / padding).

Используя простой JavaScript, вы должны иметь возможность использовать ClientWidth и ClientHeight, я думаю.

EDIT: поместите скрытые поля в тег ContentTemplate. 

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

Источник: Проблема - любое скрытое поле в панели обновлений не обновляется

0 голосов
/ 26 января 2012

Проблема здесь в том, что, поскольку этот элемент тесно обтекает текст, его размер зависит от размера текста ... а размер текста зависит от размера и масштабирования окна браузера. Следовательно, размер вашего элемента зависит от размера окна браузера, и вы не можете знать, насколько большим будет этот элемент, прежде чем он будет отображен браузером.

Лучшее решение здесь - реализовать все, что вы пытаетесь сделать, в javascript, который может легко спросить DOM браузера, насколько велик элемент.

Если это просто не вариант, следующая лучшая вещь, на которую вы можете надеяться, это записать эту серверную часть после вашего первого поста назад (и просматривать его на каждом посте обратно, потому что это изменится, если пользователь изменит размеры своего браузера окно).

0 голосов
/ 26 января 2012

Если я правильно понимаю, вы захотите добавить «runat = server» к рассматриваемому элементу. Кроме того, не забудьте присвоить ему идентификатор. После этого вы сможете получить к нему доступ в C #.

Надеюсь, это поможет!

...