Question

我正在尝试将输入值从JQUI自动完成复制到另一个输入，该输入也启用了自动完成功能。

这是我在HTML中的内容

<label for="LocationFrom">Location</label> <input id="LocationFrom" />
<label for="LocationTo">Location</label> <input id="LocationTo" />

和JS

$(function() {
$('#LocationFrom, #LocationTo').autocomplete({
    source: [
    "airport",
    "downtown",
    "street",
    "city"
            ],
    minLength: 0
})
.focus(function()
{
var self = this;

window.setTimeout(function()
{
if (self.value.length == 0)
  $(self).autocomplete('search', '');
});})});

我试过这个，但它不起作用

$('#LocationFrom').change(function() {
$('#LocationTo').val($(this).val());
});

这是fiddle

TNX

Answer 1

似乎jquery自动完成不会触发'onchange'事件; 您可以使用自动填充更改事件来解决此问题。

$(function () {
$('#LocationFrom, #LocationTo').autocomplete({
    source : [
        "airport",
        "downtown",
        "street",
        "city"
    ],
    minLength : 0,
    change : function () {
        $('#LocationTo').val($(this).val());
    }
})
.focus(function () {
    var self = this;

    window.setTimeout(function () {
        if (self.value.length == 0)
            $(self).autocomplete('search', '');
    });
})});

Answer 2

请使用精选活动。

我更新了小提琴供您参考。

http://jsfiddle.net/AknyR/16/

$(function() {
    $('#LocationFrom, #LocationTo').autocomplete({
        source: [
        "airport",
        "downtown",
        "street",
        "city"
                ],
        minLength: 0,
        select: function( event, ui ) {

            $('#LocationTo').val(ui.item.value);
           $('#LocationFrom').val('');
            return false;
}
    })
    .focus(function()
    {
  var self = this;

  window.setTimeout(function()
  {
    if (self.value.length == 0)
      $(self).autocomplete('search', '');
  });

})

$('#LocationFrom').change(function() {
$('#LocationTo').val($(this).val());
});

});

jQuery UI自动完成复制输入值到另一个输入

2 个答案: