如何使用来自数组的jquery基于其他字段的值更新字段值

时间:2017-01-30 15:53:54

标签: jquery html

我必须根据其他输入中的键入值更新输入值。结果应该来自数组。我通过阅读样本尝试了自动完成功能,但它不起作用。该数组可以是JSON对象列表或字符串。

var areas = ['907-Alaska', '205-Alabama', '251-Alabama', '256-Alabama', '334-Alabama', '479-Arkansas',....

以下是我的示例html:

<DOCTYPE html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script> 
  <script type="text/javascript">
         var months = [{ label: 'January', value: 1 }, { label: 'February', value: 2 }, { label: 'March', value: 3 }, { label: 'April', value: 4 }, { label: 'May', value: 5 }, { label: 'June', value: 6 }, { label: 'July', value: 7 }, { label: 'August', value: 8 }, { label: 'September', value: 9 }, { label: 'October', value: 10 }, { label: 'November', value: 11 }, { label: 'December', value: 12 }];
        var arr = JSON.parse(month);
        console.log(arr);
        $("#tAreaCode").autocomplete({
            source: arr,
            minLength: 2,
            select: function (e, i) {
                $("#tState").val(i.item.label);
            }
        });
    </script>
</head>
<body>
    <table style="margin:auto;width:400px;border:solid 2px red;margin-top:50px;border-radius:10px" cellpadding="10px" cellspacing="10px">
        <tr>
            <td style="text-align:center" colspan="2"><h3>Test FUNCTION</h3></td>            
        </tr>
        <tr>
            <td style="text-align:center; height: 58px;" colspan="2">
                <input id="tAreaCode" type="text" maxlength="3" 
                    class="form-control" style="width: 76px; margin-left: 13px" />
        </tr>
        <tr>
            <td style="text-align:right">State</td>
            <td style="text-align:left; width: 292px;"><input type="text" id="tState" class="form-control" style="width: 213px" /></td>
        </tr>        
    </table>

</body>

我做错了什么,因为它不起作用。

0 个答案:

没有答案