Javascript window.location.href重定向不起作用

Question

输入正确的用户名/密码后，登录成功显示。我想在成功登录后重定向到不同的页面，但是window.location.href不起作用。

的index.html

<form id="myFormlogin" action="login.php" method="POST"> 
    Email: 
    <input type="text" name="usernamelogin" /> 
    <br />Password: 
    <input type="password" name="passlogin" /> 
    <br /> 
    <button id="login">login</button> 
</form> 
<div id="ack"></div> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script type="text/javascript" src="my_script.js"></script> 

的login.php

<?php 
include_once('db.php'); 

$username = mysql_real_escape_string($_POST["usernamelogin"]); 
$password = mysql_real_escape_string(md5($_POST["passlogin"])); 

$sql = "SELECT * FROM registered_users WHERE username='$username' and password='$password'"; 
$result = mysql_query($sql); 
if ($result) { 
    echo "login success"; 
} else { 
    echo "Wrong Username or Password"; 
} 
?> 

的script.js

("#login").click(function() { 

if($("#usernamelogin").val() == "" || $("#passlogin").val() == "") 
     $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
    else 
      window.location.href = "http://jsfiddle.net/"; 
}); 

Answer 1

使用id而不是name

chnage代码为

Email: <input type="text" id="usernamelogin"/><br /> 
Password: <input type="password" id="passlogin"/><br /> 

，而不是

Email: <input type="text" name="usernamelogin"/><br /> 
Password: <input type="password" name="passlogin"/><br /> 

并使用return false防止默认动作

$("#login").click(function() { 
    if ($("#usernamelogin").val() == "" || $("#passlogin").val() == "") 
     $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
    else 
     window.location.href = "http://www.google.com"; 
    return false; 
}); 

演示：内部$(document).ready();并且还包括用户preventDefaulthttp://jsfiddle.net/satpalsingh/SzhbM/

Answer 2

我怀疑的形式马y正在提交。尝试阻止表单的默认操作。

$("#login").click(function(e) { 
    e.preventDefault(); 
    if($("#usernamelogin").val() == "" || $("#passlogin").val() == "") 
     $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
    else 
    window.location.href = "http://google.com";   

}); 

Answer 3

包裹代码，所以它会执行仅定义的代码。

例

$("#login").click(function(e) 
{ 
    e.preventDefault(); 

而且使用的是if($("#usernamelogin").val() == "" || $("#passlogin").val() == "")这个代码，但你忘了分配ID到input领域。

这就是为什么jQuery无法找到这两个字段，并进一步停止执行脚本。

你可以在萤火虫中检查它。

注释代码响应

做出改变低于的index.html页。

<form id="myFormlogin" action="login.php" method="POST"> 
    Email: <input type="text" id="usernamelogin" name="usernamelogin"/><br /> 
    Password: <input type="password" id="passlogin" name="passlogin"/><br /> 
    <button id="login">login</button> 
</form> 

我所做的是为input字段中添加name attribute。

替换你的mys_script。下面的代码

$(function() 
{ 
    $("#submit").click(function() 
    { 
     if($("#username").val() == "" || $("#pass").val() == "") 
     { 
      $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
     } 
     else 
     { 
      $.ajax({ 
       url   : $('#myForm').attr('action'), 
       data  : $('#myForm').serialize(), 
       success  : function(info) 
       { 
        $("#ack").empty(); 
        $("#ack").html(info); 
        clear(); 
       } 
      }); 
     } 
    }); 

    function clear() 
    { 
     $("form :input").each(function() { 
      $(this).val(""); 
     }); 
    } 

    $("#login").click(function() 
    { 
     if($("#usernamelogin").val() == "" || $("#passlogin").val() == "") 
     { 
      $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
     } 
     else 
     { 
      $.ajax({ 
       url   : $('#myFormlogin').attr('action'), 
       data  : $('#myFormlogin').serialize(), 
       success  : function(info) 
       { 
        $("#ack").empty(); 
        $("#ack").html(info); 
        clear(); 
       } 
      }); 
     } 
    }); 
}); 

，最终使你的login.php文件，如下修改JS，

所有的

<?php 
include_once('db.php'); 
$username = mysql_real_escape_string($_POST["usernamelogin"]); 
$password = mysql_real_escape_string(md5($_POST["passlogin"])); 

$sql="SELECT * FROM registered_users WHERE username='$username' and password='$password'"; 
$result=mysql_query($sql)or die(mysql_error()); 
$count = mysql_num_rows($result); 


if($count==1) 
{ 
    echo "found user"; 
} 
else 
{ 
    echo "Wrong Username or Password"; 
} 
?> 

Answer 4

首先使用ID选择，而不是name。所以在两个输入添加ID：

Email: <input type="text" name="usernamelogin" id="usernamelogin"/><br /> 
Password: <input type="password" name="passlogin" id="passlogin"/><br /> 

然后切换功能：

$(document).ready(function(){ 
    $("#login").click(function() { 
     if($("#usernamelogin").val() == "" || $("#passlogin").val() == "") 
      $("#ack").html("Username/Password are mandatory fields -- Please Enter."); 
      return false; 
     else 
      window.location.href = "http://google.com";   
      return false; 
    }); 
}); 

并设置return false，以防止默认动作。