Question

我有它默认是隐藏的div，使用时点击显示链接下面的JavaScript方法被称为：

function ChangeControlVisibility(elementID) { 
    var element = $("#" + elementID); 
    if (element.css('display') != 'block' && element.css('display') != 'table') { 
     element.show(); 
     var tempElement = $('div.expanded'); 
     if (tempElement.length > 0) { 
      tempElement.css('background-image', 'url(../images/arrow1.gif)'); 
     } 
    } 
    else { 
     element.hide(); 
     var tempElement = $('div.expanded'); 
     if (tempElement.length > 0) { 
      tempElement.css('background-image', 'url(../images/arrow2.gif)'); 
     } 
    } 
} 

这一步工作，但是当我调用以前的方法在Page_Load事件的方法不工作： element.css（'display'）undefined。

在前面的代码中是否有任何问题？

Answer 1

您是否在.ready()处理程序中执行该代码？

顺便说一下，除非你真的需要明确检查显示状态table，你可以只要求

$(document.ready(function(){ 
    if (!element.is(':visible')){ 
    } 
    else{ 
    } 
}); 

参考：.is()，.ready()，:visible

Answer 2

看一看：hidden和：可见的jQuery选择器。并尝试这样的事情：

function ChangeControlVisibility（elementID）var hiddenElement = $（“＃”+ elementID +“：hidden”）; var element = $（“＃”+ elementID）; if（hiddenElement.length> 0）{//检查这个元素是否存在 hiddenElement.show（）; var tempElement = $（'div.expanded'）; （tempElement.length> 0）tempElement.css（'background-image'，'url（../ images/arrow1.gif）'）; } } else { element.hide（）; var tempElement = $（'div.expanded'）; （tempElement.length> 0）tempElement.css（'background-image'，'url（../ images/arrow2.gif）'）; }
} }

Answer 3

可以通过使用.toggle()和:visible selector，这样整体简化它：

function ChangeControlVisibility(elementID) { 
    var vis = $("#" + elementID).toggle().is(':visible'); 
    $('div.expanded').css('background-image', 'url(../images/arrow' + (vis ? '1' : '2') + '.gif)'); 
} 

此切换的可见性（通过在幕后.hide()/.show()）并检查所得到的查看是否显示在页面中，并根据此设置箭头图像。