更改输入字段

Question

我遇到了一种情况，我正在使用 jquery 验证输入类型。我有 html 下拉列表，其中包含不同的参数 ("select:first-child")。我正在尝试根据这些参数验证输入框，为此我在 jquery 中编写了以下代码。例如- 如果我 select "Quantity" 那么输入框应该只接受数字。如果我 select "TradeDate" 那么输入框应该带日期。

现在的问题是，当我 select 类型为日期的参数时，日期选择器显示为 select 日期。但是当我 select 任何其他具有类型数字的参数时，输入仍然显示日期选择器。

所以，我哪里错了，我每次都想要这个验证

此处 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();
                    }
                }
            });
        });

Answer 1

一旦您使用 .datepicker() 创建器转换输入，它就会保持这种状态，直到您通过调用 .datepicker("destroy") 函数销毁它。

Answer 2

已解决... 与其采用棘手的逻辑，不如找到一种简单的方法

$(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");
        }
    });
});

更改输入字段

Changing input fields

html

javascript

jquery

jquery-ui