javascript - 使用按钮显示一些文本 - JavaScript

Question

我在 HTML 中有一些隐藏文本，我想在单击按钮时显示这些文本，但同时我希望该按钮生成 C# 中的代码

我使用此代码创建 JavaScript 函数

function toggle() {

var ele = document.getElementById("dpt");
var text = document.getElementById("Button1");
if(ele.style.display == "block") {
        ele.style.display = "none";
    text.innerHTML = "show";
}
else {
    ele.style.display = "block";
    text.innerHTML = "hide";

这是 html 中的文本和按钮

        <td id="dpt" style="display: none"> <b>Dias previstos de trabalho:</b> <asp:Label ID="Lbl_DiasTrab" runat="server"></asp:Label>&nbsp;&nbsp;&nbsp;&nbsp; </td>
    <td id= "md" style="display: none"> <b>Media Diária:</b> <asp:Label ID="Lbl_Media" runat="server"></asp:Label></td>
    <td id= "nrmed" style="display: none"> <b>Número de Médicos:</b> <asp:Label ID="LblNrMedicos" runat="server"></asp:Label></td>
    <td id= "indcob" style="display: none"> <b>Índice de Cobertura:</b> <asp:Label ID="LblIndCob" runat="server"></asp:Label></td>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Ver"  Width="74px" Height="30px" />

与此同时，我做到了，但是当我单击按钮时，它会刷新页面

我在 html 上使用了这段代码

<asp:Button ID="Button1" runat="server" onclick="Button1_Click"  OnClientClick="toggle()" Text="Ver"  Width="74px" Height="30px" />

Answer 1

@Press 是对的，您的 ID 在发送到客户端之前将在服务器端进行修改。相反，将 this 传递给 toggle，它将成为对您的按钮的引用:

JavaScript:

function toggle(text) {

    var ele = document.getElementById("dpt");
    if(ele.style.display == "block") {
        ele.style.display = "none";
        text.innerHTML = "show";
    }
    else {
        ele.style.display = "block";
        text.innerHTML = "hide";
    }
}

HTML:

<td id="dpt" style="display: none"> <b>Dias previstos de trabalho:</b> <asp:Label ID="Lbl_DiasTrab" runat="server"></asp:Label>&nbsp;&nbsp;&nbsp;&nbsp; </td>
<td id= "md" style="display: none"> <b>Media Diária:</b> <asp:Label ID="Lbl_Media" runat="server"></asp:Label></td>
<td id= "nrmed" style="display: none"> <b>Número de Médicos:</b> <asp:Label ID="LblNrMedicos" runat="server"></asp:Label></td>
<td id= "indcob" style="display: none"> <b>Índice de Cobertura:</b> <asp:Label ID="LblIndCob" runat="server"></asp:Label></td>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click"  OnClientClick="toggle(this)" Text="Ver"  Width="74px" Height="30px" />