键盘功能验证不起作用
[英]keyup function validation is not working
问题描述
i tried every possibilities but not getting the correct result. 
我尝试了所有可能性，但没有得到正确的结果。 it works fine for two digit value, but it should work for any given value. 它适用于两位数的值，但应适用于任何给定的值。 here is my code please check it and suggest me. 这是我的代码，请检查并建议我。
$(document).ready(function () { $("#height").keyup(function(){ var weight=$('#weight').val(); var height=$('#height').val(); if(weight>height){ alert("Height should be greater than Weight"); } }); });
<!DOCTYPE html> <html> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head> <body> <label>WEIGHT(kg)</label><input type="text" id="weight" name="weight" placeholder="weight"><br/><br/> <label>HEIGHT(cm)</label><input type="text" id="height" name="height" placeholder="height"> </body> </html>
i need to display an alert when the weight is greater than height. 当重量大于身高时，我需要显示警报。
4 个解决方案
解决方案1
2 已采纳 2017-10-28 06:21:55
Seems like you are comparing the text values instead of the integer values. 似乎您正在比较文本值而不是整数值。
Convert them to integers before comparing and it should work. 在比较之前将它们转换为整数，它应该可以工作。
var weight=parseInt($('#weight').val());
var height=parseInt($('#height').val());
String comparison works differently than integer comparison, for example in JavaScript 字符串比较的工作方式不同于整数比较，例如在JavaScript中
"200" > "1999" // true
200 > 1999 // false
解决方案2
1 2017-10-28 05:43:13
This will work for you. 这将为您工作。
I have used .blur function to achieve this result.Not used .keyup or .keydown function because it will effect on every key stock of the user, blur will only trigger on the focus out from the input. 我已经使用.blur函数来实现此结果。未使用.keyup或.keydown函数，因为它将影响用户的每一个关键储备， blur只会触发从输入焦点.keydown 。
$(document).ready(function() { $("#height").blur(function() { var weight = $('#weight').val(); var height = $(this).val(); if (weight > height) { alert("Height should be greater than Weight"); } }); });
<!DOCTYPE html> <html> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head> <body> <label>WEIGHT(kg)</label><input type="text" id="weight" name="weight" placeholder="weight"><br/><br/> <label>HEIGHT(cm)</label><input type="text" id="height" name="height" placeholder="height"> </body> </html>
解决方案3
1 2017-10-28 05:59:36
$(document).ready(function() { $("#height").blur(function() { compareHtWt(); }); $("#weight").blur(function() { compareHtWt(); }); function compareHtWt(){ var weight = $('#weight').val(); var height = $('#height').val(); if (weight.length>0 && height.length>0 && weight > height) { alert("Height should be greater than Weight"); return false; } } });
<!DOCTYPE html> <html> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head> <body> <label>WEIGHT(kg)</label> <input type="number" id="weight" name="weight" placeholder="weight"><br/><br/> <label>HEIGHT(cm)</label> <input type="number" id="height" name="height" placeholder="height"> </body> </html>
解决方案4
0 2017-10-28 06:08:57
Try this: 尝试这个：
$(document).ready(function(){ $('#weight, #height').on('keyup', function(){ var weight = $('#weight'); var height = $('#height'); if(weight.val().length > 0 && height.val().length > 0){ if(weight.val() > height.val()){ alert("Height should be greater than Weight"); } } }); });
<label>WEIGHT(kg)</label><input type="text" id="weight" name="weight" placeholder="weight"><br/><br/> <label>HEIGHT(cm)</label><input type="text" id="height" name="height" placeholder="height"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.