形式在与jquery动作PHP同时

我有按钮被点击时发送，jquery的操作应该被执行，并在表格中输入的数据应当在PHP被发送到数据库的形式。我写了下面HTML，PHP和JavaScript文件，但是当我点击发送，我只看到了jQuery行动执行，数据不会被发送到数据库中，我没有看到任何东西，告诉我，PHP文件运行所以这里有文件，我认为这个问题将主要来自PHP文件本身，但这里有三个文件：形式在与jquery动作PHP同时

$(document).ready(function() { 
 
\t $('#2').hide(); 
 
\t $('#3').hide(); 
 
\t $('#4').hide(); 
 
\t $('#5').hide(); 
 
\t $('#6').hide(); 
 
\t $('#7').hide(); 
 
\t $('#8').hide(); 
 
\t $('#9').hide(); 
 
\t  $('.emailpassword').click(function(){ 
 
    \t $('#1').remove(); 
 
    \t $('#2').show(); 
 
    \t $('#3').hide(); 
 
    \t $('.progress-bar').css({'width':'25%','background-color':'#f27011'}); 
 
    }); 
 
    $('#tags').click(function(){ 
 
    \t $('#1').hide(); 
 
    \t $('#2').hide(); 
 
    \t $('#3').show(); 
 
    }); 
 
    $('.add').click(function() { 
 
    \t if ($('#1').length==0) { 
 
\t \t  $('#3').hide(); 
 
\t \t  $('#2').hide(); 
 
\t \t  $('#4').show(); 
 
\t \t  setTimeout(function(){ 
 
\t \t  \t $('#4').hide(); 
 
\t \t  \t $('#5').show(); 
 
\t \t  \t $('.progress-bar').css({'width':'50%','background-color':'#f2b01e'}); 
 
\t \t  },5000); 
 
\t \t  setTimeout(function(){ 
 
\t \t  \t $('#5').hide(); 
 
\t \t  \t $('#6').show(); 
 
\t \t  \t $('.progress-bar').css({'width':'75%','background-color':'#f2d31b'}); 
 
\t \t  },9000); 
 
\t \t  setTimeout(function(){ 
 
\t \t  \t \t $('#6').hide(); 
 
\t \t  \t \t $('#7').show(); 
 
\t \t  \t },13000); 
 
\t \t  \t setTimeout(function(){ 
 
\t  \t \t $('#7').hide(); 
 
\t  \t \t $('#8').show(); 
 
\t \t  },17000); 
 
\t \t  setTimeout(function(){ 
 
\t \t  \t $('#8').hide(); 
 
\t \t  \t $('#9').show(); 
 
\t \t  \t $('.progress-bar').css({'width':'100%','background-color':'#86e01e'}); 
 
\t \t  },21000); 
 
\t \t }; 
 

 
\t }); 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Form</title> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<script type="text/javascript" src="javascript44.js"></script> 
 
<link href='https://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'> 
 
<link async href="http://fonts.googleapis.com/css?family=Passero%20One" data-generated="http://enjoycss.com" rel="stylesheet" type="text/css"/> 
 
<style type="text/css"> 
 
@font-face { 
 
    font-family: 'Coda'; 
 
    font-style: normal; 
 
    font-weight: 400; 
 
    src: local('Coda'), local('Coda-Regular'), url(http://fonts.gstatic.com/s/coda/v11/oLj2Snaoi65TK4xobg2LWRTbgVql8nDJpwnrE27mub0.woff2) format('woff2'); 
 
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; 
 
} 
 

 
@font-face { 
 
    font-family: 'Coda'; 
 
    font-style: normal; 
 
    font-weight: 400; 
 
    src: local('Coda'), local('Coda-Regular'), url(http://fonts.gstatic.com/s/coda/v11/lAc2voHjo6apblwiEW49vfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'); 
 
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; 
 
} 
 
.enjoy-css { 
 
    display: inline-block; 
 
    -webkit-box-sizing: content-box; 
 
    -moz-box-sizing: content-box; 
 
    box-sizing: content-box; 
 
    padding: 6px 20px; 
 
    border: none; 
 
    -webkit-border-radius: 32px/54px; 
 
    border-radius: 32px/54px; 
 
    font: normal 18px/normal "Coda", Helvetica, sans-serif; 
 
    color: rgba(0,142,198,1); 
 
    -o-text-overflow: ellipsis; 
 
    text-overflow: ellipsis; 
 
    background: rgba(252,252,252,1); 
 
    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2) inset; 
 
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2) inset; 
 
    text-shadow: 1px 1px 0 rgba(255,255,255,0.66) ; 
 
    -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
} 
 
.enjoy-css:hover { 
 
    background: rgba(232,249,255,1); 
 
    -webkit-box-shadow: 0 2px 2px 0 rgba(90,90,90,0.2) inset; 
 
    box-shadow: 0 2px 2px 0 rgba(90,90,90,0.2) inset; 
 
} 
 
.enjoy-css:focus { 
 
    background: rgba(255,253,232,1); 
 
} 
 
.button { 
 
    display: inline-block; 
 
    -webkit-box-sizing: content-box; 
 
    -moz-box-sizing: content-box; 
 
    box-sizing: content-box; 
 
    cursor: pointer; 
 
    padding: 10px 20px; 
 
    border: 1px solid #018dc4; 
 
    -webkit-border-radius: 3px; 
 
    border-radius: 3px; 
 
    font: normal medium/normal Arial, Helvetica, sans-serif; 
 
    color: rgba(255,255,255,0.9); 
 
    -o-text-overflow: clip; 
 
    text-overflow: clip; 
 
    background: #0199d9; 
 
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ; 
 
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ; 
 
    text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ; 
 
    -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); 
 
} 
 
.button:hover { 
 
    border: 1px solid #007cad; 
 
    background: rgba(0,142,198,1); 
 
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.3) ; 
 
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.3) ; 
 
    -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); 
 
} 
 
.button:active { 
 
    border: 1px solid #018dc4; 
 
    background: #00a6e8; 
 
    -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset; 
 
    box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset; 
 
    text-shadow: none; 
 
    -webkit-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -moz-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    -o-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1); 
 
    transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1); 
 
} 
 
p{ 
 
\t text-align: center; 
 
} 
 
</style> 
 
</head> 
 
<body> 
 
<form action="form-process.php" method="POST" name="send-question"> 
 
<input name="email" class="enjoy-css emailpassword afters" style="outline: none;" placeholder="random input 1" /> 
 
<input name="name" type="password" class="enjoy-css emailpassword afters" style="outline: none; margin-top:15px;" placeholder="random input 2" /> 
 
<input name="number" class="enjoy-css afters" id="tags" style="outline: none;margin-top:15px;" placeholder="random input 3" /> 
 
<input name="submit" type="button" class="button add" style="margin-left:10px;outline:none;"value="button" /> 
 

 
</form> 
 

 
<div class="messagewidth" style="background-color: gray; width: 43%; margin: 0 auto;border-radius: 25px; height: 22px;"> 
 
     <p id="1" class="font" style="font-family: 'Coda';">random message 1...</p> 
 
     <p id="2" class="font" style="font-family: 'Coda';">random message 2...</p> 
 
     <p id="3" class="font" style="font-family: 'Coda';">random message 3...</p> 
 
     <p id="4" class="font" style="font-family: 'Coda';">auto message 1...</p> 
 
     <p id="5" class="font" style="font-family: 'Coda';">auto message 2...</p> 
 
     <p id="6" class="font" style="font-family: 'Coda';">auto message 3...</p> 
 
     <p id="7" class="font" style="font-family: 'Coda';">auto message 4...</p> 
 
     <p id="8" class="font" style="font-family: 'Coda';">auto message 5...</p> 
 
     <p id="9" class="font" style="font-family: 'Coda';">auto message 6...</p> 
 
</div> 
 
</body> 
 
</html>

和PHP文件：（不能投入该代码段）

<?php 
if (! empty($_POST)) { 
$mysqli = new mysqli('localhost', 'user-username', 'user-password', 'database-name'); 
if ($mysqli->connect_error) { 
    die('Connect Error: ' . $mysqli->connect_errno . ': ' . $mysqli->connect_error); 
} 
$sql = "INSERT INTO tablename (email, name, number) VALUES ('{$mysqli->real_escape_string($_POST['email'])}', '{$mysqli->real_escape_string($_POST['name'])}', '{$mysqli->real_escape_string($_POST['number'])}')"; 
$insert = $mysqli->query($sql); 

$mysqli->close(); 

}; 


?>

如果问题无法从快速浏览中解决，我可以设置数据库并将文件上载到免费托管帐户，并在此处留下帐户的详细信息。

来源

2016-04-03 Jake A

你什么也没有显示提交表单数据。如果您在提交表单时不想刷新页面，则需要使用AJAX发送数据。有很多关于如何使用ajax提交表单的教程。您的PHP没有设置为返回响应 – charlietfl

我将需要使用AJAX为了不重定向到PHP文件，但我不能让PHP文件工作，并插入到数据库继续使用AJAX .. –

那么你试过的ajax代码在哪里？ – charlietfl

Actualy你应该以某种方式跟踪您的脚本（在你的情况下，POST请求）发送的HTTP的请求，使用一些调试器用于此目的（萤火虫的Mozilla浏览器中应该做的）。如果您没有看到您的页面发送任何POST请求，请尝试通过$("form[name='send-question']").submit();手动发送。现在您应该从您的服务器接收http响应，并能够分析它的内容。

来源

2016-04-03 15:48:38

它没有发送任何请求。 –

形式在与jquery动作PHP同时

回答

相关问题