Show hide div使用代碼隱藏

我有一個DropDownList我試圖顯示一個divOnSelectedIndexChanged但它說OBJECT REQUIRED。Show hide div使用代碼隱藏

我在DIV結合DataList：

ASPX：

<asp:DropDownList runat="server" ID="lstFilePrefix1" AutoPostBack="True" 
        OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" > 
    <asp:ListItem Text="Prefix1" Value="Prefix1" /> 
    <asp:ListItem Text="Prefix2" Value="Prefix2" /> 
    <asp:ListItem Text="Prefix3" Value="Prefix3" /> 
    <asp:ListItem Text="Prefix1 and Prefix2" Value="Prefix1 and Prefix2" /> 
    <asp:ListItem Text="Prefix2 and Prefix3" Value="Prefix2 and Prefix3" /> 
</asp:DropDownList> 

<asp:DataList ID="DataList1" runat="server" RepeatColumns="4" 
       CssClass="datalist1" OnItemDataBound="SOMENAMEItemBound" 
       CellSpacing="6" onselectedindexchanged="DataList1_SelectedIndexChanged" 
       HorizontalAlign="Center" Width="500px">

後面的代碼：

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
    if (lstFilePrefix1.SelectedItem.Text=="Prefix2") 
    { 
     int TotalRows = this.BindList(1); 
     this.Prepare_Pager(TotalRows); 
     Page.ClientScript.RegisterClientScriptBlock(GetType(), "JScript1", "ShowDiv('data');", true); 
    } 
}

的JavaScript：

function ShowDiv(obj) 
{ 
    var dataDiv = document.getElementById(obj); 
    dataDiv.style.display = "block"; 
}

我在做什麼錯？

來源

2009-11-16 ravi

是任何命名容器內的DIV？請查看頁面源代碼並檢查是否有一個id爲'data'的元素。 – rahul 2009-11-16 11:35:54

爲什麼在使用AutoPostBack時使用JS顯示div？將DataList放入一個面板或使div'runat =「server」'，並簡單地添加一個顯示樣式dynamiclly。 – 2009-11-16 12:09:22

充分利用DIV

runat="server"

做

if (lstFilePrefix1.SelectedValue=="Prefix2") 
{ 
    int TotalRows = this.BindList(1); 
    this.Prepare_Pager(TotalRows); 
    data.Style["display"] = "block"; 
}

您的方法不能正常工作，因爲javascript在呈現div之前正在呈現在body標記的頂部。您必須包含代碼才能告訴JavaScript等待DOM完全準備好接受您的請求，這可能最容易處理jQuery。

來源

2009-11-16 12:20:16

酷！謝謝 – ravi 2009-11-16 12:58:26

幫我解決了！非常簡單和短的代碼量！ – 2012-01-24 21:17:57

'runat =「server」'是能夠從後面的代碼中操作'div'的關鍵。 – charliebrownie 2015-03-03 14:47:44

RegisteredClientScriptBlock在頁面上後回用沒有關於秩序，這意味着要麼調用函數的聲明之後被注入保證頂部添加腳本（與功能時，您的js文件後，內聯你的調用）或者腳本試圖執行div時可能還沒有，因爲頁面仍在渲染。一個好主意可能是模擬我在螢火蟲上面描述的兩種情況，看看你是否得到類似的錯誤。

我的猜測是，如果你在頁面底部追加腳本RegisterStartupScript - 至少值得一拍。

無論如何，作爲一種替代解決方案，如果您將runat="server"屬性添加到div中，您將能夠通過它在代碼隱藏中的id訪問它（無需恢復爲js - 可能有多酷），並使其消失這樣的：

data.visible =假

來源

2009-11-16 11:38:47 JohnIdol

如果div接收到runat =「server」屬性，並且其可見性設置爲false，那麼它將不會呈現在頁面上，並且無法通過JavaScript訪問（看起來可能有必要）。 RegisterStartupScript絕對值得一試。 – 2009-11-16 12:08:29

是的，我的確提議runat = server *，而不是* js方法不結合。 – JohnIdol 2009-11-16 12:43:46

您可以使用標準ASP.NET Panel，然後在您的代碼後面設置它的可見屬性。

<asp:Panel ID="Panel1" runat="server" visible="false" />

要代碼隱藏顯示面板：

Panel1.Visible = TRUE;

來源

2009-11-16 12:25:22

這樣更容易！ – Stainedart 2012-03-01 18:58:34

應該被接受。 – 2012-12-05 13:54:41

這應該是正確的答案 – 2015-02-28 17:03:35

有幾種方法可以處理頁面上的呈現/顯示控件，您應該注意每種方法會發生什麼。

渲染和可視化

有有些情況下你的頁面上的元素並不需要呈現的用戶由於某種類型的邏輯或數據庫值的。在這種情況下，您可以完全禁止渲染（在返回的網頁上創建控件）。如果控件不需要在客戶端稍後顯示，那麼您會希望這樣做，因爲無論如何，查看頁面的用戶都不需要查看它。

任何控件或元素都可以從服務器端設置其可見性。如果它是普通的舊html元素，則只需在標記頁面上將runat屬性值設置爲server即可。

<div id="myDiv" runat="server"></div>

呈現股利或沒有決定現在可以在後面類的代碼來完成，像這樣：

myDiv.Visible = someConditionalBool;

如果設置爲true，將在頁面上呈現，如果它是假的它根本不會被渲染，甚至不會被隱藏。

客戶端隱藏

隱藏的元素只在客戶端完成。意思是，它被渲染，但它有一個display設置的CSS樣式，它指示你的瀏覽器不顯示給用戶。當您想根據用戶輸入隱藏/顯示內容時，這非常有用。只要元素/控件具有runat=server就像我在前面的示例中所解釋的那樣設置，知道該元素可以隱藏在服務器端也很重要。

隱藏在代碼類背後

要隱藏要渲染到頁面的元素，但隱藏的是代碼的另一種簡單的一行：

myDiv.Style["display"] = "none";

如果你有需要刪除display樣式服務器端，可以通過刪除display樣式或將其設置爲不同的值，如inline或block（值爲here）來完成。

myDiv.Style.Remove("display"); 
// -- or -- 
myDiv.Style["display"] = "inline";

隱藏在客戶端使用JavaScript

使用普通的舊JavaScript，您可以輕鬆地隱藏相同的元素以這種方式

var myDivElem = document.getElementById("myDiv"); 
myDivElem.style.display = "none"; 

// then to show again 
myDivElem.style.display = "";

jQuery讓隱藏的元素，如果簡單一點你更喜歡使用jQuery：

var myDiv = $("#<%=myDiv.ClientID%>"); 
myDiv.hide(); 

// ... and to show 
myDiv.show();

來源

2013-10-11 20:09:36 jlafay

我有一個問題，在我的代碼中設置element.Visible = true對實際屏幕沒有任何影響。對我來說，解決方案是將我想要在ASP UpdatePanel中顯示div的頁面區域封裝起來，該UpdatePanel用於導致部分屏幕更新。

http://msdn.microsoft.com/en-us/library/bb399001.aspx

具有元件RUNAT =服務器給我從代碼隱藏訪問它，並把它放在UpdatePanel的讓它實際上在屏幕上進行更新。

來源

2013-10-31 11:49:55 MWinstead

另一種方法（它迄今爲止沒有人提到過），是爲元素的Style數組添加一個額外的KeyValue對。即

Div.Style.Add("display", "none");

這樣做的僅僅是隱藏元素，而不是防止它被寫入到DOM開始與額外的好處 - 不像「可見」屬性。即

Div.Visible = false

結果在div 從未被寫入DOM。

編輯：這應該在'代碼隱藏'，即， * .aspx.cs文件。

來源

2015-09-06 23:47:39 XtraSimplicity

-2

隱藏在客戶端使用JavaScript

使用普通的舊JavaScript，您可以輕鬆地隱藏在這種方式相同的元素：

var myDivElem = document.getElementById("myDiv"); 
myDivElem.style.display = "none";

然後再顯示：

myDivElem.style.display = "";

jQuery使隱藏元素更簡單一點，如果你更喜歡使用jQuery：

var myDiv = $("#<%=myDiv.ClientID%>"); 
myDiv.hide();

...並表明：

myDiv.show();

來源

2016-06-14 12:09:44

<div id="OK1" runat="server" style ="display:none" > 
    <asp:DropDownList ID="DropDownList2" runat="server"></asp:DropDownList> 
</div>

vb.net代碼

Protected Sub DropDownList1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles DropDownList1.SelectedIndexChanged 
    If DropDownList1.SelectedIndex = 0 Then 
     OK1.Style.Add("display", "none") 
    Else 
     OK1.Style.Add("display", "block") 
    End If 
End Sub

來源

2016-11-04 08:32:09 Aladein

Show hide div使用代碼隱藏

回答

相關問題