1

有两个文本字段（具有自动完成功能）：

<label for="name">Customer:</label>
<input type="text" name="customer" id="customer" value=""  />
<input type="hidden" id="customer-id" />
<p id="customer-description"></p>


<label for="name">Store:</label>
<input type="text" name="store" id="store" value=""  disabled="true" />
<input type="hidden" id="store-id" />
<p id="store-description"></p>

如您所见，最初我禁用了第二个文本字段。我想要的是当用户完成从客户文本框中选择项目时，应该启用商店文本框。这是我尝试过的，但它没有启用商店字段：

$(function() {
    $('#customer').autocomplete({
        source: "./SearchCustomer.php?term="+document.getElementById("customer").value,
        minLength: 0,
        focus: function( event, ui ) {
            $( "#customer" ).val( ui.item.label );
            return false;
        },
        select: function (event, ui) {
            $( "#customer" ).val( ui.item.label );
            $( "#customer-id" ).val( ui.item.value );
            return false;
        }
    })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li>" ).append( "<a>" + item.label + "</a>" ).appendTo( ul );
    };
    $("#store").removeAttr("disabled").focus();
});

您的帮助将不胜感激。

4

2 回答 2

1

尝试这个

$(function() {
    $('#customer').autocomplete({
        source: "./SearchCustomer.php?term="+document.getElementById("customer").value,
        minLength: 0,
        focus: function( event, ui ) {
            $( "#customer" ).val( ui.item.label );
            return false;
        },
        select: function (event, ui) {
            $( "#customer" ).val( ui.item.label );
            $( "#customer-id" ).val( ui.item.value );
            $("#store").removeAttr("disabled").focus();
            return false;
        }
    })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li>" ).append( "<a>" + item.label + "</a>" ).appendTo( ul );
    };

});
于 2013-08-05T09:29:39.740 回答
1

添加$('#store').prop('disabled', false).focus();到您的选择功能：

select: function(ev, ui) {
    $( "#customer" ).val( ui.item.label );
    $( "#customer-id" ).val( ui.item.value );
    $( "#store" ).prop( 'disabled', false ).focus();
    return false;
}

因此，选择自动完成项目时，将禁用属性设置#store为false，并给出元素焦点。

这是一个小提琴

于 2013-08-05T09:30:40.593 回答