表单验证-最小数值 - Form validation - Minimum number value

有人能给我一些关于表单验证的建议吗？表单验证限制输入5以下的数字。我有一个捐款表格，只是一个金额输入字段和一个提交按钮到贝宝。

如果金额值低于5（5.00英镑），我应该使用什么表格验证来限制提交表格。

表格如下：

<form target="paypal" id="donate" action="https://www.paypal.com/cgi-bin/webscr" method="post" >
    <div class="span6 text-center">
            <input type="hidden" name="cmd" value="_cart">
            <input type="hidden" name="business" value="SECRET-ID">
            <input type="hidden" name="lc" value="GB">
            <input type="hidden" name="item_name" value="General">
            <input type="hidden" name="item_number" value="GEN">
        <div class="input-prepend input-append">
            <span class="add-on">£</span>
            <input class="span12" name="amount" value="5" placeholder="Enter Donation Amount" id="appendedPrependedInput" size="20" type="text">
            <input type="hidden" name="currency_code" value="GBP">
            <input type="hidden" name="button_subtype" value="products">
            <input type="hidden" name="no_note" value="0">
            <input type="hidden" name="cn" value="Add special instructions to the seller:">
            <input type="hidden" name="no_shipping" value="2">
            <input type="hidden" name="add" value="1">
            <input type="hidden" name="bn" value="PP-ShopCartBF:btn_cart_LG.gif:NonHostedGuest">
        </div>
    </div>
    <div class="span6 text-center">
        <div class="controls">

    <a id="buynow" class="btn btn-danger" href="#" rel="nofollow" onclick="document.getElementById('donate').submit(); return false;">
        <span style="">Donate via PayPal!</span></a>
    <noscript>
        <style>#buynow { display: none; } #page_theme #donate input { display: inline; }</style>
        <input type="submit" class="btn btn-danger" value="Donate via PayPal!">
    </noscript>             
        </div>  
    </div>  
    <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">          
</form>

在您的情况下，我会使用parsley.js

因此，要在表单上使用欧芹（安装后），请在表单中添加以下数据属性：

data-validate="parsley"

它应该是这样的：

<form target="paypal" id="donate" action="https://www.paypal.com/cgi-bin/webscr" data-validate="parsley" method="post" >

对于您的输入，添加以下数据属性（阅读文档了解更多验证规则）：

data-min="6"

所以它应该看起来像：

<input class="span12" name="amount" value="5" placeholder="Enter Donation Amount"  data-min="6" id="appendedPrependedInput" size="20" type="text">

就是这样。

有很多，但由于大多数人已经在使用JQuery，并且他们希望使用客户端验证，所以我会使用JQuery验证。请记住，对于后端，您必须使用自己的PHP、C#或任何需要的验证。如果你不使用JQuery，我会使用这个

如果您想要一个非常简单的前端解决方案，您可以使用附加到输入元素的onblur事件的Javascript函数来测试输入的值：

<input type="text" name="amount" onblur="checkValue(this)" />

在附加的函数中，您传递元素并检查该元素的值：

function checkValue(element){
    if(element.value < 5){
        alert('The minimum donation is 5.00!');
        // clear value, display message, etc.
    }
}

只要光标离开输入字段，就会触发此功能。一个简单的提醒可能就是你所需要的。您可能还需要添加额外的检查，以确保元素输入实际上是一个数字，而不是字符串。最好假设最终用户不知道如何使用表单。

请注意，这只是一个前端解决方案，所有提交的表单都应该使用所选的服务器端语言（例如PHP）进行验证。在保存数据时，您不应该接受此Javascript验证作为可靠的验证器。