Как я могу сделать видимым невидимый элемент управления с помощью jquery? (скрыть и показать не работает)

Как я могу изменить видимость элемента управления с помощью jQuery? У меня есть контроль над тем, что его видимое свойство равно false (не css).

Когда я использовал функцию show(), для этого ничего не произошло, кажется, что методы hide() и show() предназначены для набора css элемента управления, а не для видимого свойства.


jquery asp.net visibility controls visual-studio-2008-sp1
person SilverLight    schedule 11.06.2010    source источник

Ответы (4)


arrow_upward
36
arrow_downward

Вы не можете сделать это с помощью jQuery, visible="false" в asp.net означает, что элемент управления не отображается на странице. Если вы хотите, чтобы элемент управления перешел к клиенту, вам нужно сделать style="display: none;", чтобы он был фактически в HTML, иначе клиенту буквально нечего будет показывать, поскольку элемент не был в HTML, отправленном вашим сервером.

Если вы удалите атрибут visible и добавите атрибут style, вы можете использовать jQuery, чтобы отобразить его, например:

$("#elementID").show();

Старый ответ (до патрика catch)

Чтобы изменить visibility, вам нужно использовать .css(), например:

$("#elem").css('visibility', 'visible');

Если вам не нужно, чтобы элемент занимал место на странице, используйте display: none; вместо visibility: hidden; в своем CSS, а затем просто выполните:

$("#elem").show();

.show() и .hide() имеют дело с display вместо visibility, как и большинство функций jQuery :)

person Nick Craver    schedule 11.06.2010
comment
ОП заявил (не css). Хотя я не могу представить, что это значит. - person user113716; 11.06.2010
comment
@patrick - Ооооо, это вещь ASP.Net, совершенно другой ответ, я обновлю. - person Nick Craver; 11.06.2010
comment
это очень-очень плохо для меня ..... представьте, что у меня есть две кнопки рядом друг с другом, и когда одна из них невидима (из кода программной части), другая может заполнить свое пространство, и это именно то, что я хочу .... я заставил невидимую эту кнопку для некоторых условий, а также заставил ее отображать с помощью jquery и невидимую другую с помощью jquery .... поэтому с помощью css → скрытый элемент управления у меня есть пробел ... как я могу заполнить его видимой кнопкой ??? однако на самом деле спасибо за внимание и ответ// с наилучшими пожеланиями/.... - person SilverLight; 12.06.2010
comment
@LostLord - это часть ответа, охватывающая display, если вы используете display: none; вместо visibility: hidden;, то он не будет занимать место на странице, будучи скрытым. - person Nick Craver; 13.06.2010

arrow_upward
7
arrow_downward

.show() и .hide() изменяют правило отображения css. Я думаю, вы хотите:

$(selector).css('visibility', 'hidden'); // Hide element
$(selector).css('visibility', 'visible'); // Show element
person Harold1983-    schedule 11.06.2010
comment
это очень-очень плохо для меня ..... представьте, что у меня есть две кнопки рядом друг с другом, и когда одна из них невидима (из кода программной части), другая может заполнить свое пространство, и это именно то, что я хочу .... я заставил невидимую эту кнопку для некоторых условий, а также заставил ее отображать с помощью jquery и невидимую другую с помощью jquery .... поэтому с помощью css → скрытый элемент управления у меня есть пробел ... как я могу заполнить его видимой кнопкой ??? однако на самом деле спасибо за внимание и ответ// с наилучшими пожеланиями/.... - person SilverLight; 12.06.2010

arrow_upward
1
arrow_downward

Вот некоторый код, который я использую, чтобы справиться с этим.

Сначала мы показываем элемент, который обычно устанавливает тип отображения на «блок» с помощью функции .show(), а затем устанавливаем правило CSS на «видимый»:

jQuery( '.element' ).show().css( 'visibility', 'visible' );

Или, если предположить, что класс, который скрывает элемент, называется скрытым, например, в Twitter Bootstrap, toggleClass() может быть полезен:

jQuery( '.element' ).toggleClass( 'hidden' );

Наконец, если вы хотите связать функции, возможно, с эффектом затухания, вы можете сделать это так:

jQuery( '.element' ).css( 'visibility', 'visible' ).fadeIn( 5000 );
person Andy    schedule 09.06.2012

arrow_upward
0
arrow_downward

Прошло более 10 лет, и я не уверен, что кто-то все еще находит этот вопрос или ответ актуальным.

Но быстрый обходной путь — просто обернуть asp control внутри html container.

<div id="myElement" style="display: inline-block">
   <asp:TextBox ID="textBox1" runat="server"></asp:TextBox>
</div>

Всякий раз, когда срабатывает Javascript Event, если это должно быть событием asp control, просто оберните asp control вокруг контейнера div.

<div id="testG">  
   <asp:Button ID="Button2" runat="server" CssClass="btn" Text="Activate" />
</div>

Код jQuery ниже:

$(document).ready(function () {
    $("#testG").click(function () {
                $("#myElement").css("display", "none");
     });
});
person Gary Bao Yutong 鲍昱彤    schedule 09.10.2020