Ajax函数在重定向后不保存滚动位置 [英] Ajax function not saving scroll position after redirection
问题描述
正如标题所述，我编写了一个ajax函数，该函数应该在重定向之前滚动到用户所在的位置。
As the title states, I wrote an ajax function that should scroll to the position the user were before getting redirected.
我写了警告对于测试场景并且它确实触发但滚动仍然回到顶部，我在这里做错了吗？
I wrote an alert for test scenario and it does trigger but the scroll keeps getting back to the top, whave have I done wrong here?
JavaScript：
JavaScript:
$.ajax({
type: "GET",
url: "AdminListUsers.aspx?column=Disabled&direc=False&a=chstat&z=+",
success: function loadDoc() {
window.scrollTo(window.pageXOffset, window.pageYOffset);
}
});
C＃：
var toggleUrl = "AdminListUsers.aspx?column=" + (IsClicked.FirstOrDefault().Key ?? "Name") + "&direc=" + (IsClicked.FirstOrDefault().Value) + "&a=chstat&q=" + id.ToString() + "&d=" + disabled + "&z=" + Server.UrlEncode(txtSearchFor.Text);
var hl = new HyperLink();
hl.Text = status;
hl.Style.Add(HtmlTextWriterStyle.Color, (disabled ? "red" : "green"));
hl.NavigateUrl = toggleUrl;
hl.Attributes.Add("onclick", "loadDoc();return true;");
cell.Controls.Add(hl);
tr.Cells.Add(cell);
推荐答案
问题是因为它实际导航到指定的链接在超链接中。然后它也试图做ajax请求。
The problem is because it's actually navigating to the link specified in the hyperlink. Then it's also trying to do the ajax request as well.
如果要使用ajax，则不需要指定navigateURL，并且脚本需要禁止超链接的默认行为。否则，您将同时获得整页刷新和 jQuery ajax请求。由于你已经安装了jQuery，你最容易做到这一点：
If ajax is to be used there's no need to have a navigateURL specified, and the default behaviour of the hyperlink needs to be suppressed by the script. Otherwise you'll get a full page refresh and a jQuery ajax request simultaneously. Since you've got jQuery installed you can do this most easily like this:
C＃：
var hl = new HyperLink();
hl.Text = status;
hl.ID = "myLink";
hl.Style.Add(HtmlTextWriterStyle.Color, (disabled ? "red" : "green"));
hl.NavigateUrl = "#";
cell.Controls.Add(hl);
tr.Cells.Add(cell);
JS（使用不引人注意的事件处理）：
JS (using unobtrusive event handling):
$(document).ready(function() {
$("#<%= myLink.ClientID %>").click(function(event) {
event.preventDefault(); //stop the normal behaviour of the link
$.ajax({
type: "GET",
url: "AdminListUsers.aspx?column=Disabled&direc=False&a=chstat&z=+",
success: function() {
window.scrollTo(window.pageXOffset, window.pageYOffset);
}
});
});
});
这将阻止链接导致整个页面被重定向，并且只允许内容为通过ajax加载。
This will stop the link from causing the whole page to be redirected, and just allow the content to be loaded via ajax.
NB如果要在表中创建多个超链接实例，则需要使用类而不是ID来允许jQuery找到它。
N.B. If you are creating multiple instances of the hyperlink in a table, you would need to use classes rather than IDs to allow jQuery to locate it.
但是，我会质疑是什么AdminListUsers.aspx？column = Disabled& direc = False& a = chstat& z = +实际返回。或者，一个aspx页面返回一个完整的HTML页面，包括< html> ，< body> 标签等 - 如果你把它放在另一个元素，如< div> ，它会使你的页面无效 - 你不能嵌套< html> 标签。如果要使用ajax，则应使用WebMethod（或其他类型的Web服务）仅返回实际应插入元素的HTML。
However, I would question what "AdminListUsers.aspx?column=Disabled&direc=False&a=chstat&z=+" actually returns. ormally an aspx page returns a whole HTML page including the <html>, <body> tags etc - if you put this inside another element such as a <div>, it makes your page invalid - you cannot nest <html> tags. If you want to use ajax, you should use a WebMethod (or other type of webservice) to return only the HTML that should actually be inserted into the element.
这篇关于Ajax函数在重定向后不保存滚动位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
