1

まず、このフィドルにアクセスしてください: 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

しかし、成功しませんでした。修正方法は？

ありがとう。

4

3 に答える 3

2

placeholderおそらくHTML5属性を見たいと思うかもしれません。

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();
    });
于 2013-04-29T04:49:13.627 に答える
0

もう 1 つの方法は、入力要素にインライン JavaScript を使用することです。別の関数呼び出しに分割することもできます...

更新された html は次のようになります。

<input id="first_name" name="first_name" type="text" size="25" placeholder="First Name"
            onfocus="if (this.value == 'First') { this.value = ''; this.style.color = '#000000'; } " 
            onblur="if (this.value == '') { this.value = 'First'; this.style.color = '#909090'; } " 
            value="First"/>

これにより、目的の効果が得られ、入力ごとに個別に使用できます...

ここに更新されたフィドルがあります - http://jsfiddle.net/z6zsc/8/

于 2013-04-29T04:55:05.600 に答える