登錄表單提交按鈕不起作用
[英]Login form submit button does not work
問題描述
我使用PHP創建了一個簡單的單字密碼登錄。 密碼存儲在php文件中-我知道這不是很安全，但是我只想讓人們無法進入該網站。
為了測試密碼是password
您可以看到錯誤時有jQuery抖動效果。
我的問題：
為什么在單擊“提交”按鈕時我的“提交”按鈕不能使用正確的密碼，為什么單擊“ 返回”的行為與“提交”按鈕不同？
我的代碼：
HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/vibrate.js"></script>
</head>
<body>
<!-- body content -->
<div class="wrapper">
<!-- container -->
<div class="container">
<div class="col-lg-12">
<div id="login" class="form-wrapper content-flood">
<form action='php/login.php' method="post" class="login-form" id="loginform">
<h3 class="text-center">Enter your password:</h3>
<input type="password" name="password">
<input type="button" name="Submit" id="submit_butt" value="Submit" formaction="php/login.php"/>
</form>
</div>
</div>
</div>
<!-- end container -->
</div>
<!-- end body content -->
<script type="text/javascript">
$(document).ready(function() {
$("#submit_butt").click( function() {
// configurations for the buzzing effect. Be careful not to make it too annoying!
var conf = {
frequency: 5000,
spread: 5,
duration: 600
};
/* do your AJAX call and processing here...
....
....
*/
// this is the call we make when the AJAX callback function indicates a login failure
$("#login").vibrate(conf);
// let's also display a notification
if($("#errormsg").text() == "")
$("#loginform").append('<p id="errormsg">Oops, wrong password!</p>');
// clear the fields to discourage brute forcing :)
$("#pwd").val("");
});
});
</script>
</body>
</html>
PHP：
<?php
// this password may come from any source.
// it's a variable for the sake of simplicity
$password = 'password';
if($_POST['password'] == $password){
$_SESSION["userid1"] = $id1;
header("Location: ../home.html"); // redirects
}else{
}
?>
Javascript：
jQuery.fn.vibrate = function(conf) {
var config = jQuery.extend({
speed: 30,
duration: 2000,
frequency: 10000,
spread: 3
}, conf);
return this.each(function() {
var t = jQuery(this);
var vibrate = function() {
var topPos = Math.floor(Math.random() * config.spread) - ((config.spread - 1) / 2);
var leftPos = Math.floor(Math.random() * config.spread) - ((config.spread - 1) / 2);
var rotate = Math.floor(Math.random() * config.spread - (config.spread - 1) / 2); // cheers to erik@birdy.nu for the rotation-idea
t.css({position: 'relative', left: leftPos +'px', top: topPos +'px', WebkitTransform: 'rotate(' +rotate +'deg)', WebkitTransform: 'rotate(0deg)'});
};
var doVibration = function () {
var vibrationInterval = setInterval(vibrate, config.speed);
var stopVibration = function() {
clearInterval(vibrationInterval);
t.css({position: 'static'});
};
setTimeout(stopVibration, config.duration);
};
/*
Mofication by Kishore - I am commenting out the following line as it calls the vibration function repeatedly.
We need to call it only once. So, instead I make a call to doVibration() directly.
*/
//setInterval(doVibration, config.frequency);
doVibration();
});
}
;
編輯：我將PHP中的“其他”留空，因為jQuery正在處理錯誤？
我無法獲得有關此工作的JSFIDDLE，但這里是活動中的網站（也是測試版）。
4 個解決方案
解決方案1
2 2014-07-14 12:05:37
使用輸入類型Submit而不是Button
喜歡
<input type="submit" name="Submit" id="submit_butt" value="Submit" formaction="php/login.php"/>
另外，您可以使用輸入類型按鈕和使用AJAX提交表單。
解決方案2
1 2014-07-14 12:22:40
代替將偵聽器附加到“提交”按鈕，您應該在表單的“提交”操作上注冊一個偵聽器。 這樣一來，您既可以捕獲“提交”按鈕的點擊（一旦其他問題已將其更改為“提交”按鈕），又可以有人按下鍵盤上的Enter鍵：
$(".login-form").on("submit", function(e)
{
// Stop the form submitting
e.preventDefault();
// Do your checks for errors
// If there are none
$(this)[0].submit();
});
解決方案3
1 2014-07-14 12:37:51
您的服務器返回的是HTTP 302而不是HTTP 200 。 我能夠登錄，但是我確實看到搖晃和Oops ...基本上是由於邏輯不佳。
Remote Address:212.48.79.185:80
Request URL:http://hea.getevent.info/php/login.php
Request Method:POST
Status Code:302 Moved Temporarily
Request Headersview source
除非我遺漏了某些東西，否則您的邏輯看起來不太正確。 我們看不到您的ajax，但以下語句必須位於ajax調用的成功回調中。 輸入和按鈕單擊對我來說都相同。 在您的ajax調用完成之前，下面的代碼被觸發為時過早，並且您也不會阻止默認表單提交，因此它也提交了兩次。
// this is the call we make when the AJAX callback function indicates a login failure
$("#login").vibrate(conf);
// let's also display a notification
if($("#errormsg").text() == "")
$("#loginform").append('<p id="errormsg">Oops, wrong password!</p>');
並且您需要防止默認設置，以便您在確認密碼后自行提交：
$("#submit_butt").click( function(e) {
e.preventDefault();
.......
});
解決方案4
0 2014-07-14 12:18:28
您沒有提交表單，這就是為什么它沒有進行身份驗證
您可以將輸入類型從按鈕更改為提交：
<input type="submit" name="Submit" id="submit_butt" value="Submit" formaction="php/login.php"/>
或僅在您的click事件中提交表單：
$("#submit_butt").click( function() {
.
.
.
$("#loginform" ).submit();
}
表單提交按鈕在 Firefox 中不起作用，但在 Chrome 或 IE 中有效
[英]Form submit button does not work in Firefox but works in Chrome or IE
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.