jquery - 专注于每个文本输入在这里不起作用

Question

首先请访问这个 fiddle :http://jsfiddle.net/asif097/z6zsc

我希望的是，这个 jquery 代码将为该类的每个文本输入单独运行。此时，此代码同时在两个文本输入字段上运行。

这是我的 Jquery 代码:

$(".first-name-input").after("<div class='first-name-input-value'>First Name</div>");

    $(".first-name-input").focus(function(){
        $(".first-name-input-value").hide();
    });

    $(".first-name-input").blur(function(){
        if($(this).val() == ""){
            $(".first-name-input-value").show();
        }

    });

    $(".first-name-input-value").click(function(){
        $(".first-name-input").focus();
    });

我也尝试过这个:http://jsfiddle.net/z6zsc/1

但是没有成功。如何解决？

谢谢。

Answer 1

我想可能可能想看看 HTML5 placeholder属性。

http://jsfiddle.net/NWLes/

<input type="text" class="first-name-input" placeholder="First Name" required="required"/>

或修复您的代码:- http://jsfiddle.net/vYtmC/

$(".first-name-input").after("<div class='first-name-input-value'>First Name</div>");
    $(".first-name-input").focus(function(){
        $(this).next().hide();
    });
    $(".first-name-input").blur(function(){
        if($(this).val() == ""){
            $(this).next().show();
        }

    });
    $(".first-name-input-value").click(function(){
         $(this).prev().focus();
    });