2

更新:我确实使用谷歌浏览器尝试了这个网站,结果与 IE 相同

更新:我确实将 Default.aspx 脚本更改为

$("#btnSearch").click(function () {

和按钮

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

我已经使用 Ajax Control Toolkit 好几年了。想玩jQuery。我无法获得一个简单的 jQuery 教程来工作。我正在使用教程学习 jQuery:

jquery_webforms_Using_Animations

在本教程中——我跳到只是试图弹出一个对话框——在这种情况下是一个搜索窗口。

我使用 Visual Studio 2010 创建了一个新网站。Visual Studio 会自动在脚本文件夹中创建母版页、默认页、jquery 脚本等。

我将 ScriptManager 添加到母版页。我从母版页中删除了登录内容——因为我不需要 jquery 教程的额外复杂性。

我删除了 Visual Studio 在 Default.aspx 的“BodyContent”中创建的内容。

我添加了将 jquery 加载到 Default.aspx 的标头内容的脚本命令。我添加了一个简短的脚本,将事件处理程序附加到按钮以弹出对话框。我发出了几个警报,看看是什么在触发。

在内容正文中,我添加了一个将弹出对话框的按钮,并添加了将弹出的对话框。

我编译并运行应用程序,我的 Default.aspx 出现了,我可以单击“搜索”按钮,它确实回发了 - 但没有警报,也没有弹出对话框。

我无法想象一个更简单的例子——但它不起作用。有任何想法吗?谢谢。

母版页:

<%@ Master Language="VB" AutoEventWireup="false" CodeFile="Site.Master.vb" Inherits="Site" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div class="page">
    <div class="header">
        <div class="title">
            <h1>
                My ASP.NET Application
            </h1>
        </div>
        <div class="clear hideSkiplink">
            <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                <Items>
                    <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>
                    <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>
                </Items>
            </asp:Menu>
        </div>
    </div>
    <div class="main">
        <asp:ContentPlaceHolder ID="MainContent" runat="server"/>
    </div>
    <div class="clear">
    </div>
</div>
<div class="footer">

</div>
</form>
</body>
</html>

这是 Default.aspx

<%@ Page Title="Home Page" Language="VB" MasterPageFile="~/Site.Master" AutoEventWireup="false"
CodeFile="Default.aspx.vb" Inherits="_Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="~/Scripts/jquery-1.4.1.js" type="text/javascript" />
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        alert("Setting Click event handler");
        $("<%=btnSearch.clientID%>").click(function () {
            alert("Showing dialog");
            $("#searchdialog").slideDown("slow");
        });
    });
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:Button ID="btnSearch" runat="server" Text="Search" />
<div id="searchdialog" style="position: absolute; top: 65px; right: 5px; width: 200px;
    display: none;">
    <div>
        Search For Symbol</div>
    <div>
        Enter a symbol:
        <input type="text" name="txtSymbolSearch" id="txtSymbolSearch" value="" />
        <input type="button" id="btnSymbolSearch" value="Search" />
    </div>
</div>
</asp:Content
4

1 回答 1

3

在 jQuery 中缺少带有 id 的“#”:

$("#<%=btnSearch.clientID%>")

尝试这个:

 <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            alert("Setting Click event handler");
            $("#<%=btnSearch.clientID%>").click(function () {
                alert("Showing dialog");
                $("#searchdialog").slideDown("slow");
            });
        });
    </script>
于 2012-05-31T13:15:55.690 回答