Question

我正在使用jquery autocomplete combobox 一切都很好。但我也希望通过像$("#value").val("somevalue")这样的JavaScript设置特定值，并设置为select元素，但输入元素中没有自动完成的更改。

当然，我可以直接选择此输入并设置值，但还有其他一些方法吗？我尝试将绑定设置为this.element this.element.bind("change", function(){alert(1)})，但它没有效果。我不知道为什么。

修改

我找到了解决此案例的方法。但我不喜欢它。我已将以下代码添加到ui.combobox的_create函数

this.element.bind("change", function() {  
    input.val( $(select).find("option:selected").text());  
});

当我需要更改值时，我可以使用$("#selector").val("specificvalue").trigger("change");

Answer 1

this demo您要找的是什么？

该链接将jQuery UI自动完成的值设置为 Java 。焦点保留在输入上，以便可以使用普通键盘事件来导航选项。

编辑：如何将另一个功能添加到组合框中，如下所示：

autocomplete : function(value) {
    this.element.val(value);
    this.input.val(value);
}

并使用您要设置的值调用它：

$('#combobox').combobox('autocomplete', 'Java');

Updated demo

我找不到任何可用的现有功能来做你想要的，但这对我来说似乎很好用。希望它更接近你需要的行为。

Answer 2

我设法快速而肮脏地设置了价值。但是，您确实需要知道要在下拉列表中显示的项目的值和文本。

var myValue = foo; // value that you want selected
var myText = bar; // text that you want to display
// You first need to set the value of the (hidden) select list
$('#myCombo').val(myValue);
// ...then you need to set the display text of the actual autocomplete box.
$('#myCombo').siblings('.ui-combobox').find('.ui-autocomplete-input').val(myText);

Answer 3

@andyb，我想改写：

    autocomplete: function (value) {
        this.element.val(value);

        var selected = this.element.children(":selected"),
                value = selected.val() ? selected.text() : "";
        this.input.val(value);
    }

Answer 4

我真的很喜欢andyb所做的事情，但是我需要它在事件处理方面做一些事情才能处理触发变更事件，因为“选择”在输入输入或失去焦点时无法处理（点击标签或鼠标点击）。

因此，使用andyb作为基础以及最新版本的jQuery Autocomplete脚本，我创建了以下解决方案： DEMO

输入：如果菜单可见，请选择第一项
焦点丢失：部分匹配触发未找到消息并清除条目（jQuery UI），但完全输入的答案“选择”该值（不区分大小写）

如何使用Change方法：

$("#combobox").combobox({
    selected: function (event, ui) {
        $("#output").text("Selected Event >>> " + $("#combobox").val());
    }
})
.change(function (e) {
    $("#output").text("Change Event >>> " + $("#combobox").val());
});

希望这有助于其他需要其他更改事件功能的人来弥补“选定”留下的空白。

Answer 5

http://jsfiddle.net/nhJDd/

$(".document").ready(function(){
    $("select option:eq(1)").val("someNewVal");
    $("select option:eq(1)").text("Another Val");
    $("select option:eq(1)").attr('selected', 'selected');

});

这是一个工作示例和jquery，我假设您要更改select的值，更改其文本面并在页面加载时选择它？

＃

尝试2：

这是另一个小提琴：http://jsfiddle.net/HafLW/1/，你的意思是你选择一个选项，然后你想将该值附加到输入区域的自动完成中吗？

$(".document").ready(function(){
     someString = "this,that";
        $("input").autocomplete({source: someString.split(",")}); 

    $("select").change(function(){
        alert($(this).val()+" appended");
someString = someString+","+$(this).val();
        $("input").autocomplete({source: someString.split(",")}); 


    });
});

将值设置为jquery自动完成组合框

5 个答案: