javascript - 在登录表单发布到 php 并由 php 验证登录详细信息后加载 div

标签 javascript php jquery

我有一个使用 jQuery 和 html 的 login.php 文件。页面加载的标准表单部分作为 div 加载,在发布到同一页面后,应该用不同的 div 替换现有的 div 以显示已登录。我不想构建一个新的、不同的页面来实现这一点,因为我希望节省加载时间。

<head>
<script>
window.onload = function() {
$('#target').load('LoginForm.html'); //loads standard form (below). OK
};
</script>
<script src="jQuery.js"></script>
</head>

<?php # Script 16.8 - login.php
if (isset($_POST['submitted'])) {
//here I intend to have code to validate the post
//if all is OK then allow the new div to load.
?>
<script type="text/javascript">
$('#target').load('NewPageIntoDiv.html');
</script>
<?php

} // End of SUBMIT conditional.
?>
<body>
<div id="target"></div>
</body>
</html>

表单代码是标准的:

<form action="login.php" method="post">
    <fieldset>
    <p><b>Email Address:</b> <input type="text" name="email" size="20" maxlength="40" /></p>
    <p><b>Password:</b> <input type="password" name="pass" size="20" maxlength="20" /></p>
    <div align="center"><input type="submit" name="submit" value="Login" id="submitButton" onClick="" class="button"/></div>
    <input type="hidden" name="submitted" value="TRUE" />
    </fieldset>
</form>

在我的试验中,我让它直接从提交按钮加载 div,但这不允许验证和数据库引用等。所以我需要在 php 检查 POSTed 信息后加载它。在这里研究:

http://stackoverflow.com/questions/7020873/show-hide-div-if-if-statement-is-true
http://www.smashingmagazine.com/2010/02/some-things-you-should-know-about-ajax/
http://forums.devshed.com/javascript-development/4718-calling-javascript-function-php-post2108017.html

结果:提交后,只有表单框中的值消失,表单保持可见。我需要它来加载 NewPageIntoDiv.html 帮助/建议,感谢。谢谢。

最佳答案

到目前为止,这是一个好的开始。为了实现与 PHP Web 应用程序的交互,必须进行一些更改:

  • 清理代码,脚本应位于文档的底部。

  • 使用不同的事件处理程序。

我在没有框架的情况下做了同样的事情。考虑使用相同的 div 来加载内容。

如果您想避免登录 session 出现任何安全问题,请考虑使用 OAuth2 。它将使您的用户免去必须记住另一个用户 ID 和密码的问题。它使您不必保护经过身份验证的用户信息。

这个问题已经得到解答,检查一下:How to load a PHP file into a div

关于javascript - 在登录表单发布到 php 并由 php 验证登录详细信息后加载 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33322958/

相关文章:

php - jquery 发布和响应操作

javascript - 适用于 IE 6 的 Jquery 旋转图像 >

java - PHP 中 ZipArchive 的损坏提取

php - 在路由中使用资源时在 Controller 中使用自定义函数 - Laravel

Javascript:如果用户选中一个复选框,那么所有嵌套的复选框也会被选中,我该如何做到这一点?

javascript - 第一次悬停后,悬停效果无法在每个元素上正常工作

javascript - 无法将内容附加到 FormData()

javascript - 在 Node Webkit 中执行带有 HTML 代码的 .exe 或 .bat 文件

php - 构建 foreach 循环

javascript - 无限滚动 - 将 jquery 效果应用于所有滚动页面上的元素