0

我在 ZipCode 和 Phone Number 字段的典型地址输入表单上使用Josh Bush 的 Masked Input 插件( Masked Input )。

当我在表单中显示记录并在相关字段上设置输入掩码时,表单最初显示格式化的 zip (99999-9999) 和电话号码 (999)999-9999。

但是,当我发出表单重置时,输入掩码格式消失了,我留下了 zip 和电话的原始字段值 999999999 和 9999999999。

这些字段在获得焦点时会正确格式化,但我希望它们在重置后立即正确格式化。

知道如何让它与通用解决方案一起使用,而无需在表单上的所有字段中循环关注吗?

我考虑将“data-inputmask”属性添加到适当的字段并调用一个通用函数,该函数使用该属性在表单加载时建立输入掩码,但这个示例是我实际维护和访问的代码的简化在项目中使用 inputmask 是不可行的。

这是表单和脚本的简化版本:

<form action="/User/UpdateAddress" id="AddEditAddress" method="post" novalidate="novalidate">
    <input id="AddressId" name="AddressId" type="hidden" value="A5A715C7-C5DD-4793-A3D8-CE101F83224B" />
    <label for="FirstName" title="First Name">First Name</label>
    <input id="FirstName" name="FirstName" type="text" value="John" />
    <label for="LastName" title="Last Name">Last Name</label>
    <input id="LastName" name="LastName" type="text" value="Doe" />
    <label for="Address1" title="Address 1">Address 1</label>
    <input id="Address1" name="Address1" type="text" value="123 Main St" />
    <label for="Address2" title="Address 2">Address 2</label>
    <input id="Address2" name="Address2" type="text" value="Apartment 123" />
    <label for="City" title="City">City</label>
    <input id="City" name="City" type="text" value="Anytown" />
    <label for="State" title="State">State</label>
    <input id="State" name="State" type="text" value="PA" />
    <label for="ZipCode" title="Zip Code">Zip Code</label>
    <input id="ZipCode" name="ZipCode" type="text" value="191234567" />
    <label for="Phone" title="Phone">Phone</label>
    <input id="Phone" name="Phone" type="text" value="2155551234" />        
</form>
<button id="FormReset">Reset</button>
<button id="FormSubmit">Submit</button>
<script type="text/javascript">
    $("input#ZipCode").inputmask("99999-9999");
    $("input#Phone").inputmask("(999)999-9999");
    $("button#FormReset").on("click", function(){
        $("form#AddEditAddress")[0].reset();
    });
    $("button#FormSubmit").on("click", function(){
        $("form#AddEditAddress")[0].submit();
    });
</script>
4

1 回答 1

0

为什么不尝试在单击重置按钮后立即重新分配输入掩码..

$("button#FormReset").on("click", function(){
        $("form#AddEditAddress")[0].reset();
        $("input#ZipCode").unmask().inputmask("99999-9999");
        $("input#Phone").unmask().inputmask("(999)999-9999");
});
于 2012-10-01T20:11:55.270 回答