Question

我正在创建一个团队注册表单。并且必要条件是用户必须已经注册，并且只能选择团队中的注册成员。

用于检查数据库中的用户是否存在我正在使用电子邮件。该表单包含由按钮触发的多个电子邮件字段，该按钮以

形式添加字段

当用户使用ajax调用在相应的电子邮件字段中键入并在<span class='form_hint'></span>

中显示结果时，我需要检查所有用户是否存在

表单包含在隐藏的div中，并由colorbox

调用

但它似乎无法以某种方式工作

这是我的HTML代码：

更新：现在正常工作

<!DOCTYPE html>
<html dir="ltr" lang="en-US"> <head>
<title>Event Description </title>

<meta charset="UTF-8"/>
<!--Colorbox-->

    <link rel="stylesheet" media="screen" href="colorbox/css/styles.css" >
    <link rel="stylesheet" media="screen" href="colorbox/css/colorbox.css" >

<script src="colorbox/js/jquery.min.js"></script>
<script src="colorbox/js/jquery.colorbox.js"></script>

<script>
        $(document).ready(function(){
            $(".register").colorbox({inline:true,maxHeight:"95%", maxWidth:"90%"} );    
        });
</script>

    <!--Colorbox ends-->

</head>
<body>

<a class="register" href="#register">Event Registeration</a>


<script type="text/javascript">
function usercheck(){
$(document).ready(function(){
$('input[type="email"]').keyup(function() {
var name = $(this).val();
if(name=="")
{
$(".form_hint").html("");
}
else
{
$.ajax({
type: "POST",
url: "user_check.php",
data: { email: name } ,
success: function(html){
$(".form_hint").html(html);
}
});
return false;
}
});
});
}
</script>

<div style='display:none'>
  <div id='register' style='padding:10px; background:#fff;'>
    <center>        
    <form class="contact_form" action="../../register/register.php" method="post" name="contact_form">
    <ul>
        <li>
             <h2>Registration</h2>
             <span class="required_notification">* Denotes Required Field</span>
        </li>

        <li>
            <label for="email">Email:</label>
            <input type="email" name="email" placeholder="mail@example.com" onkeyup="usercheck();" required />
            <span class="form_hint">Proper format "mail@example.com"</span>
        </li>
        <span id="dynamicInput"></span>
        <li><input type="button" value="+" onClick="addInput('dynamicInput');"/></li>
        <li>

         <button class="submit" type="submit">Register</button></h4>
        </li>
    </ul>
</form></center>
  </div>



</div>





<script type="text/javascript">
function addInput(liName){
    //var counter=1;
    var newfield = document.createElement('li');
    newfield.innerHTML = "<label for='email'>Email:</label><input type='email' name='email[]' onkeyup="usercheck();"  placeholder='mail@example.com' /><span class='form_hint'></span>";
          document.getElementById(liName).appendChild(newfield);


}

</script> 

</body>
</html>

用于检查数据库中用户的PHP代码：

<?php
include('connect.php');
if(isset($_POST['email']))
{
$name=$_POST['email'];
$query=mysql_query("select * from user_details where email='$name'");
$row=mysql_num_rows($query);
if($row==1)
{
echo "Okay Pal!";
}
else
{
echo "User doesn't exist";
}
}
?>

我不知道错误在哪里，因为我第一次使用动态字段实现它

此外，我想知道处理多个电子邮件字段的好方法，例如我在上面使用的。

Answer 1

我不认为您的PHP代码中的IF-Statement已执行。

您正在检查email - 参数，但您的ajax数据看起来像data: "name="+ name

尝试将其更改为data: { email: name }，

Answer 2

首先，选择器$('#email[]')无效。尝试在电子邮件输入中添加一些类，或使用此选择器$('input[type="email"]')将事件处理程序添加到所有电子邮件字段。

接下来是keyup处理程序。在处理程序内部功能中，您可以使用$(this)而不是尝试再次选择字段。

最后一个考虑使用JSON作为数据交换类型。在服务器上返回字符串，如：{registered:true}，并在客户端上将其解析为jQuery.ajax函数设置dataType中的JSON到JSON。

Answer 3

以上代码现已完全正常运行。之前只有第一个字段调用函数并通过php检查。为了解决它，我添加了一个

function usercheck(){}

处理用户互动。

在<input type='email'>上的每个按键上，我添加了onkeyup()触发usercheck()的函数：

<input type='email' name='email[]' onKeyUp='usercheck();'>

，查询结果显示在<span>内，每个<input type='email'>字段

感谢大家的宝贵回应:)你结识了我的一天！

已解决：如何检查动态字段中的多个电子邮件地址以检查用户是否已存在

3 个答案: