4

我有一个带有 jquery-mobile 应用程序的 asp.net mvc 4。

在一个页面(url:/StatementBatch)上,我有一个批次列表,它们只是指向批次详细信息页面(url:/StetementBatch/Details/4)的链接。

<li>
    <a href="/StatementBatch/Details/4">
        <h3>January 2012</h3>

        <div style="float: right; width: 30%;"><strong>Issued  : </strong>1/10/2012 12:00:00 AM</div>
        <div style="float: right; width: 30%;">Completed</div>

        <p class="ui-li-aside"><strong>1277</strong></p>
    </a>


</li>

奇怪的是,一旦点击链接并呈现详细信息页面,浏览器的当前 url 现在是http://localhost:49457/StatementBatch#/StatementBatch/Details/4

我需要在应用程序中进行哪些更改才能修复此行为?

我的猜测是它与某种 ajax 加载相关的问题,但我共享的 _Layout.cshtml 文件包含$.mobile.ajaxEnabled = false;,我预计它会杀死所有 ajax 加载,但我显然误解了那个。

谢谢!

4

3 回答 3

4

我怀疑这可能是答案

jQuery Mobile ajaxEnabled 不起作用?

将测试,看看我是否可以使它工作

mobileinit绑定移动到 jquery 之后,但在 jquery-mobile 之前。这似乎是 MVC4(新)移动 Web 应用程序模板中的一个错误,该模板只是将所有脚本捆绑在一起

这失败了……

<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/css")" rel="stylesheet" type="text/css" />
<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/js")"></script>

<script>
    $(document).bind("mobileinit", function() {
        // As of Beta 2, jQuery Mobile's Ajax navigation does not work in all cases (e.g.,
        // when navigating from a mobile to a non-mobile page, or when clicking "back"
        // after a form post), hence disabling it.
        $.mobile.ajaxEnabled = false;
    });
</script>

但这有效....

<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/css")" rel="stylesheet" type="text/css" />

<script src="../../Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>

<script>
    $(document).bind("mobileinit", function() {
        // As of Beta 2, jQuery Mobile's Ajax navigation does not work in all cases (e.g.,
        // when navigating from a mobile to a non-mobile page, or when clicking "back"
        // after a form post), hence disabling it.
        $.mobile.ajaxEnabled = false;
    });
</script>

<script src="../../Scripts/jquery.mobile-1.1.0.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
<script src="../../Scripts/modernizr-2.5.3.js" type="text/javascript"></script>

谢谢...

于 2012-05-07T19:20:28.303 回答
1

如果您使用 jQuery mobile,这是默认行为。jQuery mobile 将使您的所有链接都被 ajaxified。这意味着它将通过 ajax 加载链接页面的内容并更新 url。如果你想禁用一个链接被 ajaxified,你可以添加rel属性external作为值

<a href="somepagep.aspx" rel="external">This will open without ajax</a>

这将正常打开页面,因此您的网址将根据新页面进行更新。

或者,您也可以 data-ajax="false"使用

<a href="somepagep.aspx" data-ajax="false">This link also will open without ajax</a>

这个链接有更多关于它的信息http://jquerymobile.com/test/docs/pages/page-links.html

于 2012-05-07T17:49:33.917 回答
0

这很奇怪。如果$.mobile.ajaxEnabled = false;设置了,那么它不应该生成 ajax 链接。请检查您的视图是否正在使用已启用此设置的其他母版页。在对应的视图目录下查找“_ViewStart.cshtml”,查看链接到哪个master。

为了禁用特定超链接使用 data-ajax="false"属性的 Ajax 行为。像下面

<a href="/StatementBatch/Details/4" data-ajax="false">
   <h3>January 2012</h3>
   <div style="float: right; width: 30%;"><strong>Issued  : </strong>1/10/2012 12:00:00 AM</div>
   <div style="float: right; width: 30%;">Completed</div>
    <p class="ui-li-aside"><strong>1277</strong></p>
</a>
于 2012-05-07T17:46:21.103 回答