easyui给文本框增加历史记录下拉列表

原因：AJAX提交不能记录历史记录

CSS：去除下拉小三角图标

<style>
        input::-webkit-calendar-picker-indicator {
            display: none;
            -webkit-appearance: none;
        }
    </style>

HTML

<input id="vin" class="easyui-textbox" data-options="prompt:'请输入17位VIN底盘号'" style="width: 200px; " />
                <datalist id="vinlist">
                    <option value="LFWSRXSJ8HAB00616" />
                    <option value="LFWSRXSJ8HAB00617" />
                    <option value="LFWSRXSJ8HAB00618" />
                    <option value="LFWSRXSJ8HAB00619" />
                </datalist>

JS （提交后调用setVins(vin); )

$(function () {

          getVins();

            $("#vin").textbox("textbox").attr("list", "vinlist")
        });

function getVins()
        {
            $("#vinlist").html("");
            if (localStorage.vins) {
                var vins = JSON.parse(localStorage.vins);
                vins.forEach(function (x, index) {
                    $("#vinlist").append('<option value="'+x+'" />');
                });
            }
        }
function setVins(vin)
        {
            if (localStorage.vins) {
                var vins = JSON.parse(localStorage.vins);
                var count = vins.unshift(vin);
                if(count>5)
                {
                    vins = vins.slice(0, 5);//截取0-4
                }
                localStorage.vins =  JSON.stringify(vins);
            } else {
                localStorage.vins = JSON.stringify([vin]);
            }
            getVins();
        }