我从http://www.formget.com/jquery-login-form/获得了一些代码并实现了它。
以下显示在jquery文件中。
$(document).ready(function()
{
$("#login").click(function()
{
var username = $("#username").val();
var password = $("#password").val();
// Checking for blank fields.
if( username =='' || password =='')
{
$('input[type="text"],input[type="password"]').css("border","2px solid red");
$('input[type="text"],input[type="password"]').css("box-shadow","0 0 3px red");
alert("Please fill all fields...!!!!!!");
}
else
{
$.post("login.php",{ username1:username, password1:password},
function(data)
{
if(data=='Invalid Email.......')
{
$('input[type="text"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
$('input[type="password"]').css({"border":"2px solid #00F5FF","box-shadow":"0 0 5px #00F5FF"});
alert(data);
}
else if(data=='Email or Password is wrong...!!!!')
{
$('input[type="text"],input[type="password"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
alert(data);
}
else if(data=='Successfully Logged in...'){
$("form")[0].reset();
$('input[type="text"],input[type="password"]').css({"border":"2px solid #00F5FF","box- shadow":"0 0 5px #00F5FF"});
alert(data);
} else{
alert(data);
}
});
}
});
});
php代码如下所示。
<?php
$connection = mysql_connect("localhost", "root", "12345"); // Establishing connection with server..
$db = mysql_select_db("deve2pro", $connection); // Selecting Database.
$username=$_POST['username1']; // Fetching Values from URL.
$password= sha1($_POST['password1']); // Password Encryption, If you like you can also leave sha1.
// check if e-mail address syntax is valid or not
$username = filter_var($username, FILTER_SANITIZE_EMAIL); // sanitizing email(Remove unexpected symbol like <,>,?,#,!, etc.)
if (!filter_var($username, FILTER_VALIDATE_EMAIL)){
echo "Invalid username.......";
}else{
// Matching user input email and password with stored email and password in database.
$result = mysql_query("SELECT * FROM e2pro_user WHERE User_email='$username' AND User_password='$password'");
$data = mysql_num_rows($result);
if($data==1){
echo "Successfully Logged in...";
}else{
echo "Username or Password is wrong...!!!!";
}
}
mysql_close ($connection); // Connection Closed.
?>
现在出现的问题是代码没有从jquery重定向到 php 页面。很高兴帮助。
答案 0 :(得分:1)
只需将您的jquery代码更改为我的代码:
<script>
$(document).ready(function()
{
$("#login").click(function()
{ alert("wao");
var username = $("#username").val();
var password = $("#password").val();
// Checking for blank fields.
if( username =='' || password =='')
{
$('input[type="text"],input[type="password"]').css("border","2px solid red");
$('input[type="text"],input[type="password"]').css("box-shadow","0 0 3px red");
alert("Please fill all fields...!!!!!!");
}
else
{
$.ajax({
type: "POST",
url: "http://localhost/testerpage.php",
data:{"Username":username,"Password":password},
success: function(data) {
if(data=='Invalid Email.......')
{
$('input[type="text"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
$('input[type="password"]').css({"border":"2px solid #00F5FF","box-shadow":"0 0 5px #00F5FF"});
alert(data);
}
else if(data=='Email or Password is wrong...!!!!')
{
$('input[type="text"],input[type="password"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
alert(data);
}
else if(data=='Successfully Logged in...'){
$("form")[0].reset();
$('input[type="text"],input[type="password"]').css({"border":"2px solid #00F5FF","box- shadow":"0 0 5px #00F5FF"});
alert(data);
} else{
alert(data);
}
}
});
}
});
});
</script>