我怎么能这个jQuery功能好一点？

Question

我有一些输入与浮动标签的顶部。其效果基本上是在电子邮件文本输入框中输入“输入您的电子邮件”。当你点击输入时，标签消失。

我对它有一个工作函数，但我有一些重复代码。

IE：

我的HTML看起来像这样：

<div id="action"> 

    <form action="/" method="post" id="#register_form"> 


     <input type="hidden" name="create" value="1" /> 

     <div class="form-field"> 
     <label for="register_name">Name (First &amp; Last)</label> 
     <input id="register_name" class="form-text" type="text" name="name" tabindex="1"/> 
     </div> 


    <div class="form-field"> 
     <label for="register_email">Enter your email</label> 
     <input id="register_email" class="form-text" type="text" name="email" tabindex="2"/> 
    </div> 

    <div class="form-field"> 
     <label for="register_password">Password</label> 
     <input id="register_password" class="form-password" type="password" name="password" tabindex="3"/> 
    </div> 

    <button type="submit">Almost there!</button> 

    </form> 

</div> 

而jQuery的看起来像这样：

$('#action input[type=text], #action input[type=password]').focus(function(){ 

    // get this label 
    var this_id = $(this).attr('id'); 

    $('label[for='+this_id+']').addClass('in_lighter'); 


}).blur(function(){ 

    // get this label 
    var this_id = $(this).attr('id'); 

    if($(this).val()==""){ 
     $('label[for='+this_id+']').removeClass('in_lighter'); 
    } 

}).keyup(function(){ 


    // get this label 
    var this_id = $(this).attr('id'); 

    $('label[for='+this_id+']').fadeOut(); 


}); 

正如你可以看到，该函数取决于几个不同的事情无论是焦点，模糊还是关键。然而，在这些功能中的每一个中，它都会抓取所选输入的id，然后使用它来标识要使用的标签。正如你所看到的，我重复这个代码3次：

// get this label 
    var this_id = $(this).attr('id'); 

有没有更好的方法呢？更简化的方法来实现相同的结果？

Answer 1

相反的：

var this_id = $(this).attr('id'); 
$('label[for='+this_id+']').addClass('in_lighter'); 

你可以这样做：

$(this).prev("label").addClass('in_lighter'); 

这将获得下一个元素这是一个标签，这样你就不需要任何ID联播然后。