シングルページアプリを作成しています。ページの最初の読み込み時に、ログイン フォームと登録フォームを表示したいと考えています (私はそうしています)。ログインすると、プロファイル ページが表示されるはずですが、空白のページが表示され、URL は次のようになりますlocalhost/xxx/checklogin.php。これは、私のアプリが何らかの理由で checklogin.php スクリプトで動かなくなっていることを意味していると思います。ここにいくつかのコードがあります - あなたは私の問題を理解し始めることができます:
js/application.js
$(document).ready(function() {
//load login form
$.get('templates/loginform.php', function(data) {
$('#login').html(data);
});
//load registration form
$.get('templates/regform.php', function(data) {
$('#register').html(data);
});
//on login form submit do
$("#loginform").submit(function(e) {
e.preventDefault();
if ($('#myusername').val() != '' || $('#mypassword').val() != '') {
$.post("checklogin.php", $(this).serialize(), function() {
$.get("templates/login_success.php", function(data) {
$("#main").html(data);
$("#login").remove();
$("#register").remove();
});
});
} else {
alert('Please enter a Username/Password');
}
});
});
私も試しました：
js/application.js
...
$("#loginform").submit(function(e) {
e.preventDefault();
if ($('#myusername').val() != '' || $('#mypassword').val() != '') {
$.post("checklogin.php", $(this).serialize(), function() {
$("#main").load("templates/login_success.php");
$("#login").remove();
$("#register").remove();
});
} else {
alert('Please enter a Username/Password');
}
});
...
index.php
<!DOCTYPE html>
<html>
<head>
<title>it IT</title>
<script src="reqscripts/jquery.js" type="text/javascript"></script>
<script src="js/application.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/application.css">
<link href='http://fonts.googleapis.com/css?family=Londrina+Solid' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="login"></div>
<div id="register"></div>
<div id="main"></div>
</body>
</html>
テンプレート/loginform.php
<?php
session_start();
?>
<form id="loginform" method="post" action="checklogin.php">
<h1 class="textaligncenter">Login</h1>
<div id="loginuser">
<input name="myusername" type="text" id="myusername">
</div>
<div id="usertext">
<p>Username:</p>
</div>
<div id="loginpass">
<input name="mypassword" type="password" id="mypassword">
</div>
<div id="passtext">
<p>Password:</p>
</div>
<div id="submitbutton">
<input type="submit" name="Submit" value="Login">
</div>
</form>
最初に (application.js で)、登録フォームとログイン フォームが読み込まれます。ログイン時に、jquery はフィールドにコンテンツがあるかどうかをチェックし、checklogin.php スクリプトへの post 呼び出しを実行します。このスクリプトは、ユーザーのログインに必要なすべてを行います。ポスト コールが成功すると、 div にtemplates/login_success.php読み込まれ、ログイン フォームと登録フォームが削除されます。main上で述べたように、アプリはフォーム送信機能内からのポスト呼び出しを通過していないようです。