如何使用JQuery在更改时立即填写文本框？

Question

I have a textbox which fills in the city. I have an autocomplete feature for that and its the standard autocomplete feature with data coming in from the db.

The data coming in has city, state and country information.When the user selects the city from the autocomplete dropdown, it should populate the city, state and country. So I have an onchange on the city for this. The problem is that the state and country are filled only when I click on the respective textboxes and not instantly as it happens with on change. Code:

$(".find-city").autocomplete(cityConfirmAutoCompleteOption);
$(".find-city").autocomplete( "option", "appendTo", "#"+'button'+q.id );

$(".find-city").change(function(city) {
$(".state").val(statecode);
}); 

HTML:

<div class="find-city"  style="float: left;">
<table>             
<tbody><tr><td><label>City</label></td>
    <td><input type="text" class="find-city"></td></tr>
    </tbody></table>
</div> 

<div class="state"  style="float: left;">
<table>             
<tbody><tr><td><label>State</label></td>
    <td><input type="text" class="state"></td></tr>
    </tbody></table>

Answer 1

Without seeing any of your HTML and most of your JavaScript, Could you not just do this:

$(".find-city").change(function(city) {
    $(".state").val(statecode);
    $(".city").val(citycode);
    //... etc.
}); 

Answer 2

If you are having problem trying to set the value of the input box, try this:

$('.state').attr('value',stateCode);

You can see similar demo here: http://jsfiddle.net/Lwhw4sj9/