Question

我在页面中有两种形式的同一个类。这些形式与相同的元素完全相同。在提交其中一个时，我尝试访问其中的元素。这是表格的样子：

<form role="form" class="login-form" id="login-form">
                  {% csrf_token %}
                <div class="form-group">
                  <div class="input-icon">
                    <i class="icon fa fa-user"></i>
                    <input type="text" class="form-control" name="email" placeholder="Username" id="email">
                  </div>
                </div>
                <div class="form-group">
                  <div class="input-icon">
                    <i class="icon fa fa-unlock-alt"></i>
                    <input type="password" class="form-control" placeholder="Password" name="password" id="password">
                  </div>
                </div>
                <div>
                  <!--input type="checkbox" id="remember" name="rememberme" value="forever" style="float: left;"-->
                  <label style="display: none; color: red;" id="incorrect_info">Veuillez vérifier vos informations</label>
                </div>

                <button class="btn btn-common log-btn">Se connecter</button>
              </form>

现在我尝试访问元素的javascript：

$('.login-form').submit(function(e){
    e.preventDefault();
    // Get information

    email = $(this).find('input[id="email"]').val();
    pass = $(this).find('input[id="password"]').val();
    $(this).find('label[id="incorrect_info"]').css('display','block');

});

此代码适用于输入，但不适用于找不到的标签。

编辑：

很抱歉这里的代码实际上是这样的。在ajax中调用find。

$('.login-form').submit(function(e){
    e.preventDefault();
    // Get information

    email = $(this).find('input[id="email"]').val();
    pass = $(this).find('input[id="password"]').val();

    $.ajax({
        .......
    }).done(function (data) {
        if (data.success) {
            window.location.href = data.url;
        }
        else {
            $(this).find('label[id="incorrect_info"]').css('display','block');
        }
    });

});

Answer 1

我想出来了。问题是$（this）范围在ajax函数内是不同的。我所做的就是在进入之前保存它，并在之后重复使用它：

$('.login-form').submit(function(e){
    e.preventDefault();
    // Get information

    this_form = $(this);

    email = $(this).find('input[id="email"]').val();
    pass = $(this).find('input[id="password"]').val();

    $.ajax({
        ......
        success  : function(data, status){
        }
    }).done(function (data) {
        if (data.success) {
            window.location.href = data.url;
        }
        else {
            this_form.find('label[id="incorrect_info"]').css('display','block');
        }
    });

});

表单中的此查找标签不起作用

1 个答案: