jQueryUI自动完成与默认的文本。

Question

我有一个jQuery自动完成的widget，其中有一些默认的阴影文本的输入，如 "输入东西"。 http:/jsfiddle.netCwmX9. 当用户在输入栏中输入一些内容并从下拉菜单中选择一些内容后，我希望将输入内容返回到阴影的默认文本。 我几乎做到了，但它没有阴影。 此外，理想的情况是，我不需要重复两次默认文本（即 "输入一些东西"）。我的脚本应该如何修改才行？

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;
    }
});

Answer 1

只要替换

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

与

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

下面是修改后的例子。http:/jsfiddle.netnetmebeFVr。

Answer 2

该 jsfiddle 提供的答案 Mikhail Chernykh 是伟大的。然而，当我在自动完成列表中进行选择时，该选择不会在输入中填充。为了让它工作，我只需要从自动完成中删除选择功能。

$("#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;
     //}
   });