Question

我有一个带有jquery-mobile app的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>

奇怪的是，点击链接后，细节页面呈现，浏览器当前网址现在为http://localhost:49457/StatementBatch#/StatementBatch/Details/4

我需要在应用中更改以修复此问题？

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

谢谢！

Answer 1

我怀疑这可能就是答案

jQuery Mobile ajaxEnabled doesn't work?

将测试并查看我是否可以使其正常工作

将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>

...谢谢

Answer 2

如果您使用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

的更多信息

Answer 3

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

要为特定超链接禁用Ajax行为，请使用data-ajax="false"属性。如下所示

<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>

ajax链接被误处理

3 个答案: