Javascript：只允许小于输入初始值的值

在我的表单上，我有许多带有预填充小数值的文本输入字段，用户可以在提交表单之前编辑值。Javascript：只允许小于输入初始值的值

我想知道是否有反正使用javascript/jquery，使每个输入只允许小于其初始值的值。

我觉得这非常具有挑战性，所以我想在这里发布它。谢谢各位

来源

2016-12-22 PaxBin

它是用于更新单个元素？ – aldrin27

恐怕我不明白你的意思是通过更新单个元素;/ – PaxBin

你不能在客户端进行验证。我可以伪造一个表格并提交。绕过任何客户端检查。您必须在服务器端进行任何严格的验证。当你只是乱搞时，这不是一个大问题;只知道你不能相信来自客户端的数据。 – Carcigenicate

使用jQuery Validation plugin的max method。

实施例：

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Makes "field" required and 23 or smaller.</title> 
<link rel="stylesheet" href="http://jqueryvalidation.org/files/demo/site-demos.css"> 

</head> 
<body> 
<form id="myform"> 
<label for="field">Required, maximum value 23: </label> 
<input type="text" class="left" id="field" name="field"> 
<br/> 
<input type="submit" value="Validate!"> 
</form> 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script> 
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/additional-methods.min.js"></script> 
<script> 
// just for the demos, avoids form submit 
jQuery.validator.setDefaults({ 
    debug: true, 
    success: "valid" 
}); 
$("#myform").validate({ 
    rules: { 
    field: { 
     required: true, 
     max: $('your_input_selector').val() 
    } 
    } 
}); 
</script> 
</body> 
</html>

来源

2016-12-22 02:16:51

感谢您的答案@DucFilan，在我的情况下，我使用的是输入数组..我该如何适应选择器的工作？ – PaxBin

它不依赖于选择器或不依赖于，如果你可以将值传递给规则，它将起作用 –

这可以帮助您：

var initialValue = $("#myTextbox1").val() 
 
$("#myTextbox1").on("input", function() { 
 
    if($("#myTextbox1").val() > initialValue) { 
 
     $("#myTextbox1").val(initialValue); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="myTextbox1" type="text" value="5"/>

来源

2016-12-22 02:22:58 user5195185

在比较之前，您应该将值转换为数字 – Barmar

如果要在表单中使用输入，则需要在事件上使用preventDefault来取消默认表单操作。 –

此溶液中的输入转换成数，防止缺省形式的动作，检查是否输入值是一个数字，如果不是，它会提醒用户并重置默认输入值，检查新值是否小于原始值inal，如果不是，则将输入重置为原始值。

HTML

<form id="myForm" action=""> 
    <input type="text" id="myValue" value="5" /> 
    <input type="button" id="myButton" value="validate" /> 
</form>

的JavaScript

var origVal = $('#myValue').val(); 

$('#myButton').on('click', function(e) { 
     var getVal = Number($('#myValue').val()); 
     e.preventDefault(); 

     if (isNaN(getVal) === true) { 
      alert('The input value has to be a number.'); 
      $('#myValue').val(origVal); 
     } 

     if (getVal > origVal) { 
      alert('The input value has to be less than the original value of ' + origVal); 
      $('#myValue').val(origVal); 
     } 
    });

来源

2016-12-22 05:08:58

Javascript：只允许小于输入初始值的值

回答

相关问题