jquery选择器-id问题

我用ajax电子邮件验证制作了一个表单。我的问题是，我需要有一个以上的电子邮件输入字段。我编写的jquery中的代码只适用于一个。我不想使用复制粘贴更改id的解决方案，因为它效率不高，而且电子邮件字段的数量也不是恒定的

这是我的js文件：

// 0 - email not valid
// 1 - email valid
$(document).ready(function() {
    $("#ClientEmail_0").focusout(function() {
        // span with loader gif
        $("#ajax_status_0").css('display','inline');
        // span with the results
        $("#email_ajax_result_0").css('display','none');
        var $email = $("#ClientEmail_0").val();
        $.post("/reservations/reservations/ajax_check_email/",{data:{Client:{email:$email}}},function(data) {
            $("#ajax_status_0").css('display','none');
            if (data == 1) {
                $("#email_ajax_result_0").attr('class','ajax_success');
                $("#email_ajax_result_0").text('Email is available');
            } 
            if (data == 0){
                $("#email_ajax_result_0").attr('class','ajax_error');
                $("#email_ajax_result_0").text('You are already our client. Proceed with the reservation.');

            }
            $("#email_ajax_result").css('display','inline');
        });
    });
});

我的看法是：

<?php
for($i = 0 ; $i < $this->params['nr'] ; $i++){
    echo $this->Form->input('Client.'.$i.'.email', array(
        'label'=>$this->Html->tag(
            'span', 
            $html->image("icons/ajax-loader.gif", array(
                "alt" => "loading",
            )), 
            array(
            'id' => 'ajax_status_'.$i,
            )), 
        'div'=>'IconMail clearValue',
        'after' => $this->Html->tag(
            'span', 
            '', 
            array(
            'id' => 'email_ajax_result_'.$i,
        )),
    )); 
} 
?>

---

谢谢

将focusout操作更改为独立的javascript函数。然后使用jquery中的函数将每个字段绑定到新函数。使用“this”变量

$（this）.css（）

选择函数中的元素

$("#ClientEmail_0").bind('focusout', yourNewFunction);
$("#ClientEmail_1").bind('focusout', yourNewFunction);

试着这样做-

首先给基本触发器元素指定公共类名saymail（在示例中为ClientEmail\u 0 one）

然后使用下面的代码

$(document).ready(function() {
    $(".mail").focusout(function() {
        var id = $(this).attr('id');
        // span with loader gif
        $("#ajax_"+id).css('display','inline');
        // span with the results
        $("#email_"+id).css('display','none');
        var $email = $("#"+id).val();
        $.post("/reservations/reservations/ajax_check_email/",{data:{Client:{email:$email}}},function(data) {
            $("#ajax_"+id).css('display','none');
            if (data == 1) {
                $("#email_"+id).attr('class','ajax_success');
                $("#email_"+id).text('Email is available');
            } 
            if (data == 0){
                $("#email_"+id).attr('class','ajax_error');
                $("#email_"+id).text('You are already our client. Proceed with the reservation.');

            }
            $("#email_"+id).css('display','inline');
        });
    });
});

将您的视图编辑为此-

<?php
for($i = 0 ; $i < $this->params['nr'] ; $i++){
    echo $this->Form->input('Client.'.$i.'.email', array(
        'label'=>$this->Html->tag(
            'span', 
            $html->image("icons/ajax-loader.gif", array(
                "alt" => "loading",
            )), 
            array(
            'id' => 'ajax_ClientEmail_'.$i,
            )), 
        'div'=>'IconMail clearValue',
        'after' => $this->Html->tag(
            'span', 
            '', 
            array(
            'id' => 'email_ClientEmail_'.$i,
        )),
    )); 
} 
?>

在上面的示例中，我的基本想法是，基本触发器元素的id应该出现在每个进一步元素的id中

例如：

如果主触发器元素id为，则称为ClientMail 然后，进一步的元素id变为

电子邮件(ClientMail)

ajax\u客户端邮件

即第一部分为常量，下一部分为主要元素id

即使有未知数量的元素，它也能工作

---

试试看，让我知道。

我不明白为什么你需要在类上使用ID。是的，我不需要使用这么多ID，只需要一个ID，其余的作为类。我会改变这个。谢谢，嗨！谢谢你的解决方案。它和我习惯的一模一样。我试图将ID更改为类，但我认为为此我需要一个通用触发器（div），所以我就这样保留了它。@Michal:很高兴我能帮助你。嗨！谢谢你的帮助。我试图使用你的解决方案，但我有一些问题，在我修复它们之前，另一个解决方案出现了。此外，我不知道如何自动绑定功能与所有电子邮件字段（他们的号码变化）。