0

次のような入力フィールドがあります。

 <input class="" type="text" id="Name_11_1" name="Name" value="Your name:">

そしてそれをこれに変えたい：

<input class="" type="text" id="Name_11_1" name="Name" value="Your name:" onblur="this.value = this.value || this.defaultValue;" onfocus="this.value == this.defaultValue && (this.value = '');"Your name:">

問題は、入力フィールドを直接編集できず、外部のjavascriptコードを使用する必要があることですが、私のjsレベルは初心者なので、すべてのヘルプをいただければ幸いです。

4

3 に答える 3

2

jQueryの場合：

   <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script>
        $(function() {
            $('#Name_11_1').blur(function() {
                $(this).val(YOUR_EXPR); 
            });

            $('#Name_11_1').focus(function() {
               $(this).val(YOUR_EXPR); 
             });
        });
    </script>
于 2013-03-27T11:24:07.883 に答える
1

最初に既存のイベントハンドラーを削除してから、独自のイベントハンドラーをアタッチします。

var obj = document.getElementById('Name_11_1');

obj.removeAttribute('onfocus');
obj.removeAttribute('onblur');

obj.addEventListener('blur', function() {
    // your js code for blur event
});
obj.addEventListener('focus', function() {
    // your js code for focus event
});
于 2013-03-27T11:28:27.723 に答える
1

ブラウザがタグのplaceholder属性を理解している場合は、次のinputように使用できます。

<input id="foo" name="foo" placeholder="Your name">

次に、JavaScriptを追加して、他のブラウザーにフォールバックを提供できます。

if (!'placeholder' in document.createElement('input')) {
    $('#foo').on('focus', function() {
        // your code
    }).on('blur', function() {
        // your code
    });
}

更新input：OPがタグを直接編集できないことを忘れました。その場合、コードスニペットは次のように変更できます。

var elem = $('#Name_11_1'),
    defaultValue = 'Your name';

if ('placeholder' in document.createElement('input')) {
    elem.attr('placeholder', defaultValue);
} else {
    elem.on('focus', function() {
        // your code
    }).on('blur', function() {
        // your code
    });
}
于 2013-03-27T11:32:41.123 に答える