javascript - JQuery Mobile 出错

Question

下面，我收到此错误：

在此处输入图像描述

我已将问题代码缩小到 JQuery Mobile 1.0 或更高版本和 Asp.NET ScriptManager。

我向 Visual Studio 2012 添加了一个新的 Web 窗体项目，并包含以下代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
    <link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" ScriptMode="Release" runat="server"></asp:ScriptManager>
    <div>

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

代码隐藏页面中没有代码。

就是这样，但是当我运行项目时，当同时包含 ScriptManager 和 JQuery Mobile 脚本时，我会收到上述错误。
删除 JQuery Mobile 或 ScirptManager 时不会发生错误。

想了半天并试图找到解释，我遇到的一个特定网站建议将 ScriptMode="Release" 添加到 ScriptManager。

将 ScriptMode="Release" 添加到 ScriptManager 后，我没有收到上述错误。

搜索定义了 ScriptMode 的 MSDN：获取或设置一个值，该值指定是否呈现客户端脚本库的调试或发布版本。

将ScriptMode添加到ScriptManager后没有抛出错误，但是为什么呢？有人可以解释为什么添加 ScriptMode 会阻止错误出现，并且仅添加 ScriptMode 就意味着真正的求解器或创可贴？

错误在这里抛出：在此处输入图像描述

谢谢

下面我包含了呈现的 HTML 页面：

<!DOCTYPE html>

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

</title><link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

</head>
<body>
    <form method="post" action="WebForm1.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE3MTc1MDc5MjBkZKegov+UVDfF6HxSUeRymFH24991gFZlPU0b/IsFSVOC" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<script src="/WebResource.axd?d=YNeW-uV30W9QUFseu7cpdlXTvjGS-17TUbJFOrYgly8h7oJPnNmO65B9MsXEKqakJOaVgg29CB6vB4ZdmlLF7g8EEKPfdXLBpPT96ABclOM1&amp;t=634773918900000000" type="text/javascript"></script>


<script src="/ScriptResource.axd?d=1zt3Mkq4WcBu9zbsV4m9-M7KCvrT-jr1XXgEzhW9nlIjwSm5LqLoLvy1RRMu-5CPbCTtFRsnupAShqvEwf1EA89LxKLiAOgKvWaOicLhKJXKcoRKfxG9wfeNLN-ZylWfgK9ozBiE9bfZ-FsMcBHxpWRRemoiIMSGZzuYvNAs6Evl_1N7xJCIcbyAp01izsBK0&amp;t=6119e399" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');
//]]>
</script>

<script src="/ScriptResource.axd?d=QXV43dBeyoevgM325nU9rlBmVyB375pfaFEuLQ1v1BisiTdf-HdmxtF90_hgFfCcn3l6abc0C_OIvNebx_7cosgD1E8ZEeTK680r4HRGT7Pngzk9Ei-BKOI48hrwHGv9cUfKN2zloA0qh8YHXKfefO8eUGQhV8M-XarSzMOPpgJwr8FS8Yb8rvlVPvcSzSTE0&amp;t=6119e399" type="text/javascript"></script>
        <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ScriptManager1', 'form1', [], [], [], 90, '');
//]]>
</script>

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

下面我展示了我是如何尝试打开 noConflict 的：

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>

<script type="text/javascript">
    $.noConflict();
</script>

<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

score 9 · Accepted Answer

我测试了您的代码，并且能够复制错误。

首先，我认为 ScriptManager 必须在使用它的任何东西之前存在。这样做不会导致错误：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
    <link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    </form>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</body>
</html>

其次，您包含的脚本是缩小版或发布版。这是一个未经证实的猜测，但它可能需要非缩小或调试版本进行渲染，并且它们不存在并且放置 ScriptMode="Release" 可能让它知道它应该使用缩小版本。这可以通过在项目中包含缩小和调试脚本而不是远程获取它们来进行测试......这就是 MVC 的工作方式，这就是为什么我建议 Web 应用程序可能工作相同的原因。

旁白：按照此链接上的信息，这是另一种不会产生任何错误的方法：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
    <link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
                <Scripts>
                <asp:ScriptReference Path="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"/>
                <asp:ScriptReference Path="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js" />
            </Scripts>
        </asp:ScriptManager>
    </form>
</body>
</html>

编辑：

出于某种原因，我还尝试在 Web.config 中进行设置：

<compilation debug="true" targetFramework="4.0"/>

对此：

<compilation debug="false" targetFramework="4.0"/>

这也适用于您的原始代码，但由于某种原因，我觉得它是一个创可贴，因为它很可能只是隐藏错误而不是修复它。

javascript - JQuery Mobile 出错

1 回答 1

Related

Reference