jquery 为什么我可以设置一个标签的位置而不是另一个？

Question

检查这个 JS fiddle 。 http://jsfiddle.net/jclamp/Nf7Fc/3/

Name 的标签是通过 jquery 创建的，然后可以使用它的父字段的位置来设置它的位置。

电子邮件标签是通过表单验证创建的。相同的 jquery 应该能够设置它的位置，但事实并非如此。为什么？

作品:

$('#name').after('<label class="error" for="name">I can create this label via jquery and then move it\'s position.</label><br>');

$('label.error').css('left', 
                     function() {
                    return $('input[name='+$(this).attr('for')+']' ).offset().left;
                     } 
                      );

不起作用:

$("#registerForm").validate();

$('label.error').css('left', 
                     function() {
                    return $('input[name='+$(this).attr('for')+']' ).offset().left;
                     } 
                      );

Answer 1

尝试 .prop()而不是 .attr() :

    $('label.error').css('left', function() {
        // find input element assigned to the label
        var inputName = $(this).prop('for'); // <--- here
        var inputElement = $('input[name=' + inputName + ']' );

        // you can use logging to see which element jQuery actually found:
        console.log(inputElement);

        return inputElement.offset().left;
    });

这是一个工作示例:http://jsfiddle.net/JjYPR/3/

希望这对您有所帮助。

不过我对您的代码有一些注释。您的 jsfiddle 中的代码根本不起作用。元素名称存在一些错误，当您按下提交按钮时，没有任何内容得到验证，但发生了另一个错误。下次您发布问题时，请牢记以下提示:

• 使用 Firebug 或其他调试工具检查错误
• 如果您的代码可以正常工作，请创建一个同样有效的 jsfiddle
• 尝试缩进代码以使其更具可读性

这样人们就更容易帮助你。 ;)