Question

我有一个jqueryscript，可以在没有masterpages的情况下使用asp.net页面。当页面获得对母版页的引用时，脚本将停止工作。

主页：在标题内：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

在codebehind：

protected void Page_Load(object sender, EventArgs e)
    {
        string script = "$(document).ready(function () { $(\"img[src*='help']\").click(function () { var id = $(this).attr(\"id\"); $(\"#helpviewer\").toggle(400); $(\"#helpviewer\").load(\"" + Page.ResolveUrl("~/help/help.aspx") + " \" + \"#\" + id); return false; }); });";
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), Guid.NewGuid().ToString(), script, true);
    }

这是jquery加载的helppage：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="help.aspx.cs" Inherits="help_help" meta:resourcekey="PageResource1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Untitled Page</title>
    </head>

    <body>
        <form id="form1" runat="server">
            <div id="helpUploadFile">
                <asp:literal id="Literal1" runat="server" meta:resourcekey="Literal1Resource1"></asp:literal>
            </div>
            <div id="helpPictureArchive">
                <asp:literal id="Literal2" runat="server" meta:resourcekey="Literal2Resource1"></asp:literal>
            </div>
            <div id="image1">
                <asp:literal id="Literal3" runat="server" meta:resourcekey="Literal3Resource1"></asp:literal>
            </div>
        </form>
    </body>
</html>

我相信我的问题在于.load。脚本正常运行，帮助查看器显示但文本未加载。

Here is a working testpage without masterpage.和here is a testpage with the masterpage。只需单击图像即可查看jquery。

任何想法都错了吗？

Answer 1

在服务器端生成JavaScript时，应使用控件的ClientID属性而不是ID属性。客户端也是如此：

var control = document.getElementById('<%=controlid.ClientID%>');

在服务器端：

@"<script .....
 var control = document.getElementById('"+controlid.ClientID+"');";
 // etc
 ";

Answer 2

主页（或任何其他容器）中的ID由于命名容器的工作方式而受到损坏，所以我喜欢使用jQuery的结尾和选择器来引用我的服务器控件：

$("[id$='MyControlName']");

由于损坏的ID总是在右边有控件名称，这只是起作用。受损的ID看起来像这样：MasterPage1_ctl02_MyControlName

我看到有人批评这种方法相对于在Control.ClientID中连接而言相对较慢，这就是我以前的做法。但是避免使用Control.ClientID意味着您可以将JavaScript存储在单独的文件中，这是最佳做法。有时，如果你变得非常动态，在服务器上做JS是不可避免的。但是在一个单独的文件中你可以更好地分离关注点，Visual Studio会给你一些智能感知，等等。

以下是相关问题：jQuery Selector: Id Ends With?

有关命名容器的更多信息：MSDN Article

Answer 3

当您使用母版页时，所有嵌套控件（基本上都是这些控件）都会更改其ID。

如果您使用的是asp.net 4.0或更高版本，则可以add ClientIdMode="Static" to your controls，并且在使用母版页时它们不会更改ID。

Answer 4

我可以假设当您将页面移动到MasterPage时，页面上的所有id属性都将被更改（asp.net在使用Master页面时添加一些前缀）。但是你的“〜/ help / help.aspx”页面可能不知道这个，所以js脚本无法在该页面上找到文本。

Asp.Net MasterPage和JQuery

4 个答案: