回發后如何執行特定的JavaScript以啟用特定的面板

Question

我想找出一種方法來執行特定的javascript，它會在回發之后觸發特定塊的可見性？

這是完成任務的鏈接按鈕

<asp:LinkButton ID="lbtView" runat="server" CssClass="btn btn-xs btn-default" CommandArgument='<%# Eval("OrderId.OrderId") %>' CommandName='<%# "Details" %>'><i class="fa fa-eye"></i></asp:LinkButton>     <%--Order Datails--%>

這是我要在回發后執行的腳本，以切換特定塊的可見性

Response.Write("$('').hide(); $('#orderDetails').show()");

我當前代碼的部分

   <asp:ListView ID="ListView1" runat="server" OnItemCommand="ListView1_ItemCommand">
                               <ItemTemplate>
                                   <tr>
                                       <td><asp:Label ID="lblOrderNo" runat="server" Text='<%# Eval("OrderId.OrderId") %>'></asp:Label></td>
                                       <td><asp:Label ID="lblDate" runat="server" Text='<%# String.Format("{0:dd/MM/yyyy}", Eval("DateOfPayment") ) %>'></asp:Label></td>
                                       <td><asp:Label ID="lblAmount" runat="server" Text='<%# String.Format("{0:C}", Eval("FinalAmount")) %>'></asp:Label></td>
                                       <td class="text-center">
                                           <div class="btn-group">
                                            <asp:LinkButton ID="lbtView" runat="server" CssClass="btn btn-xs btn-default" CommandArgument='<%# Eval("OrderId.OrderId") %>' CommandName='<%# "Details" %>'><i class="fa fa-eye"></i></asp:LinkButton>     <%--Order Datails--%>
                                          <%--  <asp:Button ID="lbtView" runat="server" Text="Button" CssClass="btn btn-xs btn-default" CommandArgument='<%# Eval("OrderId.OrderId") %>' CommandName='<%# "Details" %>' href="#"></asp:Button>--%>
                                           <asp:LinkButton ID="lbtInvoice" runat="server" CssClass="btn btn-xs btn-default" CommandArgument='<%# Eval("OrderId.OrderId") %>' CommandName='<%# "Invoice" %>'><i class="fa fa-file-text"></i></asp:LinkButton>        <%--Order Invoice   --%>                                                
                                            </div>
                                       </td>
                                   </tr> 
                               </ItemTemplate>
                           </asp:ListView>

相關課程的部分

protected void ListView1_ItemCommand(object sender, ListViewCommandEventArgs e)
{
    if (e.CommandName == "Details")
    {
        Response.Write("$('').hide(); $('#orderDetails').show()");
        OId = e.CommandArgument.ToString();


        //Bind order items
        lblOrderNo.Text = e.CommandArgument.ToString();
        Payment p = PaymentDB.getPaymentFromOD(e.CommandArgument.ToString());
        List<OrderItem> oiList = OrderDetailsDB.getOrderItems(e.CommandArgument.ToString());
        lblOrderDate.Text = p.DateOfPayment.ToShortDateString();
        lblTodtal.Text = p.FinalAmount.ToString("C");

        //---------------------------------Order Items Bind


        //----------------------------------------------------------------Status Update-----------
        BindStatus(oiList);

    }
    else if (e.CommandName == "Invoice")
    {
        Session["orderID"] = e.CommandArgument.ToString();
        Server.Transfer("order-invoice.aspx");
    }
}

由於默認情況下#orderDetails是隱藏的，因此每當頁面重新加載時，它將再次變為隱藏，換句話說，我必須嘗試僅在頁面加載之后切換塊的可見性。 還是有人對此有其他建議？

Answer 1

如果需要，可以使用ClientScript.RegisterClientScriptBlock設置腳本標簽：

ClientScript.RegisterClientScriptBlock(this.GetType(), "MyScript", "alert('hello');", true)

但是我可能建議使用占位符（或面板）來控制服務器端任何內容的可見性：

<asp:PlaceHolder ID="orderDetailsPlaceholder" runat="server" Visible="false">
    <div id="orderDetails">
        Content
    </div>
</asp:PlaceHolder>

---

無論如何，后面的代碼：

orderDetailsPlaceholder.Visible = true

希望這可以幫助！

Answer 2

如果orderDetails是服務器控件，則只需使用orderDetails.Visible = true即可顯示它。 不需要Javascript。

如果不是服務器控件，則需要確保它最初是使用CSS在客戶端隱藏的，並且Javascript注冊塊應為Response.Write("$('').hide(); $('#" + orderDetails.ClientID + "').show()");

請注意，實際上您應該使用Page.ClientScript.RegisterStartupScript注冊腳本，並且由於使用的是jQuery，因此請將腳本添加到$(document).ready事件中，以便在加載DOM后運行。