更改输入字段

时间:2019-04-01 11:47:25

标签: javascript jquery html jquery-ui

我遇到了一种情况,我正在使用jquery验证输入类型。 我有包含不同参数("select:first-child")的html下拉列表。 我正在尝试根据这些参数验证输入框,为此我在jquery中编写了以下代码。 例如- 如果选择“数量”,则输入框应仅包含数字。 如果我选择“ TradeDate”,则输入框应带有日期。

现在的问题是,当我选择类型为date的参数时,datepicker出现以选择日期。 但是,当我选择其他任何具有数字类型的参数时,输入仍显示datepicker。

所以,如果我错了,我希望每次验证

此处var type [1]包含参数的类型,例如。浮动,日期,字符等。

 $("#cond_div").children("select:first-child").change(function(event){
            var temp = $(this).val();
            var type = temp.split("_");

            $("#cond_div").children("input").on("keypress keyup", function () {

                if (type[1].localeCompare("date") == 0) {
                    $(this).datepicker();
                } 
                else if (type[1].localeCompare("float") == 0) {
                    $(this).val($(this).val().replace(/[^0-9\.]/g, ''));
                    if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                } 
                else if (type[1].localeCompare("int") == 0) {
                    $(this).val($(this).val().replace(/[^0-9\.]/g, ''));
                    if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                }
            });
        });

2 个答案:

答案 0 :(得分:0)

使用.datepicker()创建者对输入进行转换后,它将一直保持这种状态,直到您通过调用.datepicker(“ destroy”)函数销毁该输入为止。

答案 1 :(得分:0)

已解决... 不用费劲的逻辑,而是找到一种简单的方法

$(document).ready(function () {
    $("#cond_div").children("select:first-child").change(function (event) {
        var temp = $(this).val();
        var type = temp.split("_");
        console.log("->" + temp);
        console.log("->" + type);

        $("#cond_div").children("input").val("");
        $("#cond_div").children("input").datepicker("destroy");


        if (type[1].localeCompare("date") === 0) {
            console.log(type[1]);
            $("#cond_div").children("input").datepicker();
        } else if (type[1].localeCompare("char") === 0) {
            console.log(type[1]);
            $("#cond_div").children("input").attr("type", "text");
        } else if (type[1].localeCompare("float") === 0) {
            console.log(type[1]);
            $("#cond_div").children("input").attr("type", "number");

        } else if (type[1].localeCompare("int") === 0) {
            console.log(type[1]);
            $("#cond_div").children("input").attr("type", "number");
        }
    });
});