Question

我正在使用jQuery验证插件，在我添加focus()和blur()事件处理程序以删除并设置预填充值后，如果我尝试在不更改默认值的情况下提交表单，则将值替换为空字符串，如果需要，保持值不变，并运行validate()。

JS代码如下：

$.validator.addMethod("mobileHR", function(phone_number, element) {
    phone_number = phone_number.replace(/\(|\)|\s+|-/g, "");
    return this.optional(element) || phone_number.length > 9 &&
        phone_number.match(/^\+[0-9]{1,3}\.[0-9]{1,14}$/);
}, "Unesite broj u fromatu: +385.111234567");


$(document).ready(function () {
    // append help block below input
    $('.controls').append('<span id="helpBlock" class="help-block">Format broja: +385.11123456789</span>');

    // clear pre populated value on focus 
    var value = $("input[name='contactdetails[Registrant][Phone]']").val();

    $("input[name='contactdetails[Registrant][Phone]']").focus(function() {
        if ($(this).val() == value)
        {
            $(this).val("");
        }
    }).blur(function(event) {
        if($(this).val() == "")
        {
            $(this).val(value);
        }
    });

    // initialize validation
    $('.form-horizontal').validate({ 
        // set immediate validation, on event code 9
        onkeyup: function (element, event) {
            if (event.which === 9 && this.elementValue(element) === "") {
                return;
            } else {
                this.element(element);
            }
        },
        rules: {
            "contactdetails[Registrant][Phone]": {
                required: true,
                mobileHR: true
            }
        },
        messages: {
            "contactdetails[Registrant][Phone]": {
                required: "Molimo unesite broj telefona"
            }
        }
    });

    // check if form is valid then enable submit button
     $('.form-horizontal input').on('keyup blur', function () {
        if ($('.form-horizontal').valid()) {
            $('.btn-primary').removeClass('btn-disabled');
        } else {
            $('.btn-primary').addClass('btn-disabled');
        }
    });

    //do we valid form on document.ready?
    //$('.form-horizontal').valid();

});

小提琴是here。

Answer 1

经过一番研究，我发现为什么表格上的价值会发生变化：

$("input[name='contactdetails[Registrant][Phone]']").focus(function() {...});

在提交表单后，运行validate()，并且当字段为空时，输入字段将被聚焦，因此再次触发focus（），输入字段的值为""。

将事件更改为click输入字段变得集中，但值不受影响，因为现在函数会在点击事件中触发。

为什么表单提交默认值已删除？

1 个答案: