如何使用gridview内的linkbutton获取document.getElementById（'id01'）的值

Question

我想使用gridview内部的链接按钮获取document.getElementById（'id01'）的值，这里是我想要的代码

<div id="id01" class="modal">
    <form class="modal-content animate">

        <div class="imgcontainer"></div>
        <span onclick="document.getElementById('id01').style.display='none'" class="close" title="Close Modal">×</span>
        <div class="container"> 
           <p> This message was rejected by the recipient email system. Please check the recipient's email address and  try resending this message, or contact the recipient directly</p>
            <p> A problem occurred while delivering this message to this email address. Try sending this message again. If the problem continues, please contact your helpdesk.</p>
            <p> The domain name in the email address is incorrect. Check the address.</p>
            <p> Sorry, I couldn't find any host named like([email protected]). Please check the email address and try again.</p>
            <p> The server has tried to deliver this message, without success, and has stopped trying. Please try sending this message again.<br /> If the problem continues, contact your helpdesk.</p>
            <button type="button" runat="server" onclick="document.getElementById('id01').style.display='none'" id="btncancel">Cancel</button>
            <br />
            <asp:Label runat="server" ID="lblError"></asp:Label>
        </div>
    </form>
</div>

这是我的grivdiew上的代码

<form id="form1" runat="server">
<div>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" CellPadding="4" OnRowCommand="GridView1_RowCommand" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
        <Columns>
            <asp:TemplateField HeaderText="Subject">
                <ItemTemplate>
                   <<pre><asp:LinkButton ID="LinkButton1"  runat="server" CommandArgument="EmailDetails" CommandName="DisplayEmail" Text='<%# Eval("Subject") %>'></asp:LinkButton>


            <%--<asp:BoundField DataField="Subject" HeaderText="Subject Email" />--%>
            <asp:BoundField DataField="Sender" HeaderText="Receiver" />
            <asp:BoundField DataField="DateCreated" HeaderText="Date and Time Sent" />
            <asp:BoundField DataField="DateReceive" HeaderText="Date and Time Received" />
            <asp:BoundField DataField="EmailHeader" HeaderText="Details" />

        <FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
        <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
        <PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
        <RowStyle BackColor="White" ForeColor="#330099" />
        <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
        <SortedAscendingCellStyle BackColor="#FEFCEB" />
        <SortedAscendingHeaderStyle BackColor="#AF0101" />
        <SortedDescendingCellStyle BackColor="#F6F0C0" />
        <SortedDescendingHeaderStyle BackColor="#7E0000" />

这是javascript代码

script>
// Get the modal
var modal = document.getElementById('id01');
var modal = document.getElementById('id02');
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>

这是我的后端代码

protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        if (e.CommandName == "DisplayEmail")
        {


        }

        }

任何人都可以帮我获取document.getElementById（'id01'）并在点击链接按钮时显示模态。现在我使用网格外的按钮来显示模态

这是按钮的代码

 <button onclick="document.getElementById('id01').style.display='block'" runat="server">List Email Errors</button>

Answer 1

我建议使用jQuery。

var targets = $('#id01, #id02');
targets.on('click,touch', () => {
     $(this).hide();
});

此外，您通过在此处声明两次来覆盖模态 -

var modal = document.getElementById('id01');
var modal = document.getElementById('id02');