显示按钮上的Div单击

Question

我试图在按钮点击时显示加载div,但此刻它不起作用.

Javascript:

<script type="text/javascript">
        $(document).ready(function (e) {      
            $('#BtnSend').click(function () {
                $('#<%= loading.ClientID %>').toggle("slow");
            });
        });
    </script>

DIV:

<div id="loading" class="Loading" runat="server" visible="false">
  <div class="loadingImg">
    <img src="../Images/loading.gif" alt="loading" />
    </div>
  </div>

按钮:

<asp:Button ID="BtnSend" runat="server" Text="SEND" 
            onclick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />

另外如何在代码(c#)中的jsfiddle中调用相同的javascript代码？

Answer 1

你必须从左侧菜单中选择jQuery版本,jsFiddle not支持解释asp.net代码并生成html as asp.net engine do.

现场演示

$(document).ready(function (e) {
    $('#BtnSend').click(function () {
        $('#loading').slideToggle("slow");
    });
});

如果您尝试在asp.net中执行相同操作,并且您的BtnSend是没有设置ClientIDMode的服务器控件,static那么您将需要使用ClientID来绑定事件.

$(document).ready(function (e) {
    $('#<%= BtnSend %>').click(function () {
        $('#<%= loading.ClientID %>').slideToggle("slow");
    });
});

ClientID值设置为ID属性的值.如果控件是命名容器,则该控件将用作其包含的任何控件(参考)的命名容器层次结构的顶部.