Question

我正在尝试Ajaxify正常的页面重定向。

ASPX（查看：Parent.aspx）：

<a id="GetContent" href="#">Go to Content Page</a>

ASPX（查看：Content.aspx）：

<div id="content">
   ...
</div>

Controller（ContentController.cs）：

public ActionResult Index(id)
{
    var content = _db.GetContent(id);
    return View("Content");
}

JS：

$(document).on("click", "#GetContent", function () {
        location.href = "/Index/3";
});

我试过这个。但是，这有效，URL栏中的URL不会更改。

$(document).on("click", "#GetContent", function () {
           $("#content").load("/Index/3");
    });

因此，当您点击链接时，它目前正常回发，然后重定向到〜/ Content / 3（即没有ajax）。我想要的是立即转到内容页面，然后在提取内容时显示加载指示器。我知道我可能必须使用jQuery.load（）来做这件事，但不太确定如何把事情放在一起。

感谢任何帮助！

Answer 1

我认为这就是你要做的......

的Index.aspx：

<div id="content">
   ...
</div>

<script>
    $(document).ready(function() {
      $.ajax({
        url: '/Content/Details/3', // <-- Can use @Html.ActionLink here, to utilize routing a bit.
        success: function(data) {
          $('#content').html(data);
        }
      });
    });
</script>

ContentController.cs：

public ActionResult Index(id)
{
    return View("Index");
}

public ActionResult Details(id)
{
    var content = _db.GetContent(id);
    return PartialView("_Details", content);
}

如果你在div中放入loader.gif，我认为你会得到你正在寻找的行为。您还需要确保已创建_Details视图，并显示模型中的任何内容（ var content ）。

Answer 2

我会链接jquery（通过

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

）然后使用

var checking = "<img src='ajax-loader.gif'/>";
$("#content").innerHTML=checking
$("#content").load("/content/3");

将其加载到页面

中

通过ajax重定向到页面

2 个答案: