[英]Call Enter event on keypress javascript
我有以下代码可验证最多10位数字的移动电话号码,并且我使用输入type="text"
因为minlength
在type="number"
上工作,但是问题是当我尝试单击提交表单时键盘输入,未提交
$('#welcome_submit').on('click', function() { $.ajax({ url: '/url', data: $('#entry_form').serialize(), type: "POST", datatype: 'JSON', success: function(data) { alert('success'); }, error: function(error) { console.log("Error: error"); }, }); }); $(document).ready(function() { document.querySelector("input").addEventListener("keypress", function(evt) { if (evt.which < 48 || evt.which > 57) { evt.preventDefault(); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <form id="entry_form"> <input type="text" value="" placeholder="Enter your Mobile Number" class="form-class" name="phone_no" autocomplete="off" autofocus maxlength="10" /> <button id="welcome_submit" class="btn btn-continue welcome_first" type="submit">Continue</button> </form>
在上述代码中过滤Enter事件'13'有什么想法吗?
检查键码13并提交表格:
if (evt.keyCode == '13') {
document.querySelector('#welcome_submit').click();
}
$('#welcome_submit').on('click', function() { $.ajax({ url: '/url', data: $('#entry_form').serialize(), type: "POST", datatype: 'JSON', success: function(data) { alert('success'); }, error: function(error) { console.log("Error: error"); }, }); }); $(document).ready(function() { document.querySelector("input").addEventListener("keypress", function(evt) { if (evt.which < 48 || evt.which > 57) { evt.preventDefault(); } if (evt.keyCode == '13') { document.querySelector('#welcome_submit').click(); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <form id="entry_form"> <input type="text" value="" placeholder="Enter your Mobile Number" class="form-class" name="phone_no" autocomplete="off" autofocus maxlength="10" /> <button id="welcome_submit" class="btn btn-continue welcome_first" type="submit">Continue</button> </form>
你可以听的形式,而不是听的输入KEYUP /按键事件上的提交事件:
$('#entry_form').on('submit', function(event) { event.preventDefault(); var serializedData = $(this).serialize(); // Ajax request ... });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <form id="entry_form"> <input type="text" value="" placeholder="Enter your Mobile Number" class="form-class" name="phone_no" autocomplete="off" autofocus maxlength="10" /> <button id="welcome_submit" class="btn btn-continue welcome_first" type="submit">Continue</button> </form>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.