0

「EnterSomething」 http://jsfiddle.net/CwmX9/などの入力にデフォルトの影付きテキストがあるjQueryオートコンプリートウィジェットがあります 。ユーザーが入力フィールドに何かを入力し、ドロップダウンから何かを選択した後、入力を影付きのデフォルトテキストに戻したいと思います。私はほとんどそれを行っていますが、それは日陰ではありません。さらに、理想的には、文字通りのデフォルトテキスト（つまり「EnterSomething」）を2回複製する必要はありません。そのためにスクリプトをどのように変更する必要がありますか？

PS。また、入力値が実際に入力に表示される文字と必ずしも同じではない場合がある理由も説明してください。それは私の最初の質問にいくらか関連しているのではないかと思います。

<div class="ui-widget">
    <label for="tags">Tags:</label>
    <input id="tags" value="Enter Something" class="default-value" />
</div>

$('.default-value').each(function () {
    var $t = $(this),
        default_value = this.value;
    $t.css('color', '#929292');
    $t.focus(function () {
        if (this.value == default_value) {
            this.value = '';
            $t.css('color', 'black');
        }
    });
    $t.blur(function () {
        if ($.trim(this.value) == '') {
            $t.css('color', '#929292');
            this.value = default_value;
        }
    });
});

var availableTags = [
    "ActionScript",
    "AppleScript",
    "Asp",
    "BASIC",
    "C",
    "C++",
    "Clojure",
    "COBOL",
    "ColdFusion",
    "Erlang",
    "Fortran",
    "Groovy",
    "Haskell",
    "Java",
    "JavaScript",
    "Lisp",
    "Perl",
    "PHP",
    "Python",
    "Ruby",
    "Scala",
    "Scheme"];

$("#tags").autocomplete({
    source: availableTags,
    select: function (event, ui) {
        console.log(this);
        //console.log(this,$(this).val());
        $(this).val('Enter Something').blur();
        //console.log(this,$(this).val());
        return false;
    }
});
4

2 に答える 2

2

交換するだけ

$(this).val('Enter Something').blur();

と

$(this).val('').blur();

変更された例は次のとおりです。http：//jsfiddle.net/netme/beFVr/

于 2013-03-26T14:12:59.403 に答える
0

MikhailChernykhによって提供されたjsfiddleの答えは素晴らしいです。ただし、オートコンプリートリストで選択を行った場合、その選択は入力に入力されませんでした。それを機能させるには、オートコンプリートから選択機能を削除する必要がありました。

$("#tags").autocomplete({
source: availableTags,
//select: function (event, ui) {
     //console.log(this);
     //console.log(this,$(this).val());
     //$(this).val('').blur();
     //console.log(this,$(this).val());
     //    return true;
     //}
   });
于 2020-04-24T16:47:28.073 に答える