jQuery_jqueryをベースに入力ボックスに値がない場合に指定したデータを自動表示する実装コード

【解決策】

1.準備

(1)入力ボックス

コードをコピーコードは次のとおりです:

(2) ) CSS コード

コードをコピー コードは次のとおりです:

input.helpText { color: #aaa;}

(3) 変換方法

コードをコピー コードは以下の通りです。

関数 switchText()
{
if ($(this).val() == $(this).attr('title'))
$(this ).val('') .removeClass('helpText');
else if ($.trim($(this).val()) == '')
$(this).addClass(' helpText').val($(this).attr('title'));
}

(4) 具体的な実装

コードをコピー コードは次のとおりです:

$('input[type=text][title!=""]').each(function) () {
if ($.trim($(this).val()) == '') $(this).val($(this).attr('title')); ($(this).val() = = $(this).attr('title')) $(this).addClass('helpText')
}).focus(switchText).blur(switchText); ;

$(' フォーム').submit(function() {
$(this).find('input[type=text][title!=""]').each(function () {
if ($( this).val() == $(this).attr('title')) $(this).val('')
; });

2. 参考記事

http://webservices.blog.gustavus.edu/2008/06/23/text -input-example-text-with-jquery /