jQuery 遮罩插件不能以字母开头 'S'
jQuery Mask Plugin Can't start with letter 'S'
我想对以 SP
和 PT
开头的输入使用掩码。 PT
输入工作正常,但 SP
不工作。请注意,这不是我的真实代码,它只是一个示例。
$('#partshort').mask('SP-00000000000');
$('#svpshort').mask('PT-00000000000');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<div class="container">
<h3>Problems with jQuery Mask Plugin?</h3>
<p>Exemplify your problem here :-)</p>
<hr />
<form role="form">
<div class="form-group">
<label for="date-field">Example 1</label>
<input type="text" class="form-control" id="partshort">
</div>
<div class="form-group">
<label for="ip-field">Example 2</label>
<input type="text" class="form-control" id="svpshort">
</div>
</form>
</div>
问题是因为掩码库中的S
字符有特殊含义:
By default, jQuery Mask Plugin only recognizes the logical digit A (Numbers and Letters) and S (A-Za-z) but you can extend or modify this behaviour
https://igorescobar.github.io/jQuery-Mask-Plugin/docs.html#translation
要解决您的问题,您只需删除 S
字符翻译,使其与任何标准字符一样工作:
$('#partshort').mask('SP-00000000000', {
translation: { S: null }
});
$('#svpshort').mask('PT-00000000000');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<div class="container">
<h3>Problems with jQuery Mask Plugin?</h3>
<p>Exemplify your problem here :-)</p>
<hr />
<form role="form">
<div class="form-group">
<label for="date-field">Example 1</label>
<input type="text" class="form-control" id="partshort">
</div>
<div class="form-group">
<label for="ip-field">Example 2</label>
<input type="text" class="form-control" id="svpshort">
</div>
</form>
</div>
我想对以 SP
和 PT
开头的输入使用掩码。 PT
输入工作正常,但 SP
不工作。请注意,这不是我的真实代码,它只是一个示例。
$('#partshort').mask('SP-00000000000');
$('#svpshort').mask('PT-00000000000');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<div class="container">
<h3>Problems with jQuery Mask Plugin?</h3>
<p>Exemplify your problem here :-)</p>
<hr />
<form role="form">
<div class="form-group">
<label for="date-field">Example 1</label>
<input type="text" class="form-control" id="partshort">
</div>
<div class="form-group">
<label for="ip-field">Example 2</label>
<input type="text" class="form-control" id="svpshort">
</div>
</form>
</div>
问题是因为掩码库中的S
字符有特殊含义:
By default, jQuery Mask Plugin only recognizes the logical digit A (Numbers and Letters) and S (A-Za-z) but you can extend or modify this behaviour
https://igorescobar.github.io/jQuery-Mask-Plugin/docs.html#translation
要解决您的问题,您只需删除 S
字符翻译,使其与任何标准字符一样工作:
$('#partshort').mask('SP-00000000000', {
translation: { S: null }
});
$('#svpshort').mask('PT-00000000000');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<div class="container">
<h3>Problems with jQuery Mask Plugin?</h3>
<p>Exemplify your problem here :-)</p>
<hr />
<form role="form">
<div class="form-group">
<label for="date-field">Example 1</label>
<input type="text" class="form-control" id="partshort">
</div>
<div class="form-group">
<label for="ip-field">Example 2</label>
<input type="text" class="form-control" id="svpshort">
</div>
</form>
</div>