用按钮显示一些文本 - JavaScript答案

【问题标题】：Show some text with a button - JavaScript用按钮显示一些文本 - JavaScript
【发布时间】：2015-09-09 13:51:41
【问题描述】：

我在 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" />

【问题讨论】：

你需要检查你的元素。后面的代码可能是在元素的 ID 之前添加了类似“MainContentPlaceholder_YOURID”的内容。

标签： javascript c# html

【解决方案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" />

【讨论】：

没看懂抱歉
@MaraPimentel 我更新了代码以显示完整的示例。
@MaraPimentel 所以你只希望按钮调用toggle 方法而不是别的？我问是因为你也有onclick="Button1_Click" 属性。
我说我想要的是Button1在点击Button1的时候同时调用onclick="Button1_Click"和OnClientClick="toggle(this)。我想在后面调用一些代码在 Button1_Click 上并调用 javascript 函数
哦！我误解了。服务器端点击处理程序需要提交（刷新）页面才能触发事件。如果您想在不刷新页面的情况下触发服务器端代码，您应该考虑使用 AJAX。网络上有无限的资源可以帮助您。