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()）並檢查所得到的查看是否顯示在頁面中，並根據此設置箭頭圖像。