Ajax数据库浏览器页面刷新更改页面而不是刷新页面
Ajax database browser page Refresh changes the page instead of refreshing it
我正面临AJAX和PHP数据库的问题。我敢打赌,许多其他新的Ajax程序员也会面临这个问题。虽然我已经缩短了代码,但它仍然有些长,所以请耐心等待。我在主页上有一个按钮index.php点击时,加载图书管理系统,因为它是Ajax数据库,所以图书管理系统加载在一个div('mainDiv')在同一页面上。问题是,当图书管理系统打开时,无论何时刷新/重新加载页面(通过单击浏览器刷新按钮),它都会意外地返回到带有按钮的主页。刷新后,页面内容应该保持不变。但这在这里从来没有发生过。在Ajax中这样做会使它变得更加复杂。有没有简单/容易的Ajax解决方案?也请指出,如果某些东西在这段代码是违反良好的编程实践。这是我的代码:**数据库首页/index.php脚本部分**
<script language="javascript">
function submitData(dataSource,divID,formId)
{
var PostData;//assuming the form's post data has been already serialized to keep the question simple
var dataSource;
/*setting up XMLHttpRequestObject*/
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest)
{ XMLHttpRequestObject = new XMLHttpRequest();}
else if (window.ActiveXObject)
{ XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");}
else if (window.ActiveXObject)
{ XMLHttpRequestObject = new ActiveXObject("MSXML2.XMLHTTP");}
else { alert ("XMLHttpRequestObject can not be created");}
/*processing sending of the form's post data*/
if(XMLHttpRequestObject)
{
var obj = document.getElementById(divID);
XMLHttpRequestObject.open("POST", dataSource);
XMLHttpRequestObject.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 &&
XMLHttpRequestObject.status == 200) {
obj.innerHTML = XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.send(PostData);
}
}
</script>
数据库首页/index.php:
<h2>
Ajax Books Database
</h2>
<div id="mainDiv">
<form id="books-management-sys-targeting-form">
<input type="hidden" name="open-bms" value="open-jms" />
<input type="button" onclick="submitData('phpcontroller.php','mainDiv','books-management-sys-targeting-form')" value="Open Books Management System" />
</form>
</div>
当点击上面主页上的按钮时,PHP控制器执行以下代码:
/*Opening Books Management System*/
if(isset($_REQUEST['open-bms']))
{
include 'books-management-system.html.php';
}
以下是books-management-system.html.php代码:
//manage books categories link
<form id="to-manage-book-categories-form">
<input type="hidden" name="manage-book-categories" value="manage-book-categories" />
<a href="#" onclick="submitData('phpcontroller.php','mainDiv','to-manage-book-categories-form','personalform.txt')" >Manage Books Categories</a>
</form>
.
.
//other tasks related to managing books
.
.
我必须在这段代码中做什么更改,以便当我刷新它时,它应该显示相同的当前打开的页面/内容,而不是主页面。在Ajax中是否有简单的方法来做到这一点?请帮助!
您要求一些最佳实践?
- 不要使用
onclick
HTML属性。相反,使用addEventListener()或一些跨浏览器的变化(这就是jQuery派上用场的地方)。这就是为什么最好不要使用onclick html属性:http://en.wikipedia.org/wiki/Unobtrusive_JavaScript 正确缩进你的代码。现在几乎无法读取将XMLHttpRequest对象存储到一个变量中。这样长的变量名很难阅读。看看这个教程,看看代码可以有多干净。
Kamal的解决方案对我来说似乎太过分了。此外,他的解决方案并不是所有的浏览器都支持。
一种可能的方法是在第一次提交ajax查询时将其保存在cookie或会话变量中。然后,当页面加载时,检查该cookie/变量,并返回正确的页面数据。(别忘了清除cookie,变量)
可以将onsubmit的输出重定向到另一个页面,这样您就可以重新加载页面并仍然看到相同的内容。在
if (window.XMLHttpRequest)
{ XMLHttpRequestObject = new XMLHttpRequest();}
else if (window.ActiveXObject)
{ XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");}
else if (window.ActiveXObject)
{ XMLHttpRequestObject = new ActiveXObject("MSXML2.XMLHTTP");}
else { alert ("XMLHttpRequestObject can not be created");}
永远不会到达2d else if
else if (window.ActiveXObject)
{ XMLHttpRequestObject = new ActiveXObject("MSXML2.XMLHTTP");}
,因为它与第一个条件相同,如果
我可以建议使用历史方法。pushState(statobj, "page 2", "bar.html");当你点击一个按钮时,使用上面的pushstate,你可以在浏览器中改变url,但页面不会重定向,你的ajax响应将留在页面上。现在,当你刷新页面时,新的url就会出现,它会将你的页面重定向到新的页面,在这个页面上你可以得到你的图书管理系统。我建议通过facebook。正如我们所知,facebook使用ajax检索数据。当你点击消息选项卡,你会得到ajax响应,你的url应该是facebook.com/messages,但你仍然在主页上。当您刷新页面时,您将被重定向到消息/索引文件,从那里再次显示消息历史记录。我希望以上的解释可以帮助到你和其他人。
- 从MySQL数据库中获取输入数据需要两次页面刷新
- HTML按钮刷新页面而不是将数据发送到数据库
- 使用angularJs中的数据库数据源刷新下拉列表
- 如何在不刷新页面的情况下从 PHP 中的 SQL Server 数据库获取数据
- 需要帮助-用数据库中的数据替换DIV内容而不刷新(使用-jquery、hmlhttp、CI)
- 数据库更新后刷新数据表
- 从数据库中检索数据而不刷新页面
- 为什么Meteor在刷新后会复制数据库对象
- PHP-插入数据库而不刷新页面(OOP)
- 如何在td中显示从数据库中检索数据而不刷新
- 定期轮询数据库,Rails 视图更新而不刷新
- 需要 Ajax 函数 - 在不刷新页面的情况下更新数据库
- Javascript 刷新查询数据库
- 使用下拉列表中的值查询 MySQL 数据库,然后使用结果填充文本字段而不刷新页面
- 我想显示数据库中的数据.如果我们新添加一个表单数据,我想附加显示的新帖子而不使用代码点火器刷新
- 将标题标签与数据库连接并使其自动刷新,就像在Facebook标题中一样
- 如何在不刷新页面的情况下从数据库(mysql)加载更新的数据
- 需要在不刷新的情况下从数据库中获取值
- 在没有Javascript's setTimeout()的情况下刷新数据库条目后的页面
- 谷歌折线图-自动刷新数据库