Javascript 无法使用js在按钮单击上隐藏div

我有4个div和4个不同的按钮，我想在按下相应的按钮时隐藏一个特定的div

我的asp代码是

<div class="div2">
    <div class="d1" id="one">
        <h3 class="h3">First Division</h3>
        <hr color="black" />
    <p class="text-green">
        //some text

    </p>
        <br />
        <asp:Button class="btn" ID="Button1" runat="server" Text="Click Me to Hide" />
    </div>
    <div class="d1" id="two">
        <h3 class="h3">Second Division</h3>
        <hr color="black" />
    <p class="text-red" >
        //some text
    </p>
        <br />
        <asp:Button class="btn" ID="Button2" runat="server" Text="Click Me to Hide" />
    </div>
    <div class="d1" id="three">
        <h3 class="h3">Thrid Division</h3>
        <hr color="black" />
    <p class="text-blue">
        //some text
    </p>
        <br />
        <asp:Button class="btn" ID="Button3" runat="server" Text="Click Me to Hide" />
    </div>
    <div class="d1" id="four">
        <h3 class="h3">Fourth Division</h3>
        <hr color="black" />
    <p class="text-yellow">
        //some text
    </p>
        <br />
        <asp:Button class="btn" ID="Button4" runat="server" Text="Click Me to Hide" />
    </div>

但点击按钮时什么也没发生。出现这种错误的原因是什么？？？

将clientmode=“Static”添加到asp:按钮中，如下所示：

<asp:Button ID="Button1" runat="server" ClientIDMode="Static" Text="Button" />

工作小提琴…看看下面的链接，它工作正常
确保在每个错误处理程序中放置e.preventDefault（）。比如说

$("#Button1").click(function (e) {
    e.preventDefault();
    $("#one").hide('slow');
});

如果不这样做，将导致asp.net回发，因为这些按钮位于表单标记内。正如另一个用户所说，删除runat=“server”，因为这会更改您的id

你甚至不需要asp:按钮，你可以使用html

<button id="#Button1">Button Label</button>

按钮标签
只需将JQuery更改为：

$(document).ready(function () {
    $('.btn').on('click',function (e) {
        e.preventDefault();
        $(this).closest('.d1').hide('slow');
    });
});

你能发布你的HTML吗？就像另一个用户说的，删除runat=“server”，。。。如果他需要回复怎么办？他做的事不需要回复。他只是在显示一个div。如果他确实需要回发，他确实需要runat=“server”属性。要求他删除runat=server会让他得出另一个结论，相反，你应该要求他添加clientmode=“Static”，如果他不打算将按钮绑定到codebehind事件处理程序，为什么他需要在服务器上运行按钮？
$(document).ready(function () {
    $('.btn').on('click',function (e) {
        e.preventDefault();
        $(this).closest('.d1').hide('slow');
    });
});