.append(data) 到所有 <input type="email">

Question

你好 stackoverflow 用户，

如何将.append(data) 仅用于1 个<input type="email">？

因为我用jquery.com 的文档尝试了.each()，但我还不是很清楚。

我现在拥有的是；

<script type="text/javascript">
    $("input#email").keyup(function(){
        $.ajax({
            type: "POST",
            url: "checklistHandler.php?action=valEmail",
            data: $("input#email")
        }).done(function(data){
            $("span.emailCheck").empty().append(data);
        });
    });
</script>

在我的表格中，我有 2 倍 <input type="email">，但是当我只填写第一个时，它应该只检查第一个 <input type="email">。
但它会检查所有<input type="email">。

希望你们能帮助我！

问候。

[更新 1]

<input style="min-width: 212px; max-width: 212px;" type="email" id="email"      name="buildingblock[<?=$onderdeel['formBuildingBlockId']?>][content]" value="<?= $onderdeel['formContent'] ?>" <?=($onderdeel['formRequired'] == 'on' ? 'required' : '')?>><span class="emailCheck"></span>

[更新 2]

if ($_GET['action'] == "valEmail") {
foreach ($_POST['buildingblock'] as $key => $value) {
    if (empty($value['content'])) {
        ?>
        <img src="<?=IMG?>/cross.png">
        <p style="background-color: red; text-align: center; color: #ffffff; border-radius: 4px;">Het E-Mail veld mag niet leeg zijn!</p>
        <?
    } else {
        if (!preg_match('/^[^@]+@[a-zA-Z0-9._-]+\.[a-zA-Z]+$/', $value['content'])) {
            ?>
            <img src="<?=IMG?>/cross.png">
            <p style="background-color: red; text-align: center; color:white; border-radius: 4px;">Dit is geen geldig E-Mail adres</p>
            <?
        } else {
            ?>
            <img src="<?=IMG?>/tick.png">
            <?
        }
    }
    return;
}
exit();
}

Answer 1

你需要在post方法中这样使用ajax()

更改为data: $("input#email").val()

 $.ajax({
        type: "POST",
        url: "checklistHandler.php?action=valEmail",
        data: $("input#email") // change here  $("input#email").val()
    }).done(function(data){
        $("span.emailCheck").empty().append(data);
    });

Answer 2

检查下面的代码。使用数据：$(this).val()。此外，如果值为空，则它不会执行 ajax 代码。

 $(document).off('keyup').on('keyup',"input[type='email']",function(){
   if($.trim($(this).val()).length > 0){ 
     var obj = $(this); 
     $.ajax({
        type: "POST",
        url: "checklistHandler.php?action=valEmail",
        data : obj.val(),
    }).done(function(data){
        obj.next("span.emailCheck").empty().append(data);
    });
  }
});