javascript - 取消屏蔽日期时间 - inputmask

Question

使用 Inputmask Vanilla js 版本。

在取消屏蔽日期时间格式时遇到问题:

var expDate = document.getElementById('expDate');

Inputmask({
    alias: 'datetime',
    inputFormat: 'mm/yy',
    placeholder: 'month/year',
    autoUnmask: true,
    clearMaskOnLostFocus: false
}).mask(expDate);

autoUnmask 不工作，expDate.value 返回 12/12，尽管它应该返回 1212。

Answer 1

我创建了一个最小示例，autoUnmask 选项正在运行，可能与 alias: 'datetime' 或 inputFormat: 'mm/有一些冲突是的”。阅读插件网站上提供的下一个文档:

别名

使用别名，您可以定义复杂的掩码定义并使用别名调用它。所以这主要是为了简化你的面具的使用。在扩展中发现的一些别名是:电子邮件、货币、小数、整数、日期、日期时间、dd/mm/yyyy 等。

首先您必须创建一个别名定义。别名定义可以包含掩码选项、自定义定义、要使用的掩码等。

当您传入别名时，首先解析别名，然后应用其他选项。因此，您可以调用别名并传递另一个掩码以应用于别名。这也意味着您可以编写从另一个别名“继承”的别名。

一些示例可以在 jquery.inputmask.xxx.extensions.js 中找到

格式

除了屏蔽输入元素之外，还可以使用 inputmask 来格式化给定值。考虑格式化值以在 jqGrid 或其他元素上显示然后输入。

var formattedDate = Inputmask.format("2331973", { 别名: "datetime", inputFormat: "dd/mm/yyyy"});

如您所见，datetime 是定义的别名(您可以在 inputmask.date.extensions.js 上查看定义)，而 inputFormat 用于其他目的.在下一个示例中，一个输入的 autoUnmask 选项配置为 true，另一个输入的默认值为 false:

// Get the inputs fields

var expDate1 = document.getElementById('expDate1');
var expDate2 = document.getElementById('expDate2');

// Apply masks on the inputs.

Inputmask({
    alias: 'date',
    autoUnmask: true,
    clearMaskOnLostFocus: false
}).mask(expDate1);

Inputmask({
    alias: 'date',
    clearMaskOnLostFocus: false
}).mask(expDate2);

// Alert values.

function getValuesFromInputs()
{
    var msg = "Value of Input1 with autoUnmask=true: " + expDate1.value;
    msg += "\n"
    msg += "Value of Input2 with autoUnmask=false: " + expDate2.value;

    alert(msg);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/dependencyLibs/inputmask.dependencyLib.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/inputmask.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/inputmask.extensions.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/inputmask.date.extensions.js"></script>

<input type="input" id="expDate1"/>
<input type="input" id="expDate2"/>
<button type="button" onclick="getValuesFromInputs()">Get Values</button>