Question

我很想知道是否有人可以为我的表单编写验证码。

我有一个名为“arrivaldate”的日历字段，而不是带有以下项目的下拉列表，例如某些优惠：

无
白色优惠
黑色优惠

白色优惠仅在“到货日期”为4月1日至25日期间有效

黑色优惠仅在“到期日”于4月20日至5月15日期间有效

因此，如果用户按下选择“白色优惠”的“发送”按钮并且在4月1日至25日期间选择“到达日期”，则验证会给出错误“此优惠不适用于选定的时期“。

我非常感谢你从现在开始的帮助，我提前感谢你。

亲切的问候

菲利普

Answer 1

请试试这个，

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link id="bsdp-css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker.css" rel="stylesheet">
<script>
    $(document).ready(function(){

        $('#arrivaldate').datepicker({
            format: 'yyyy/mm/dd'
        });

        $("#btn").on('click',function(){
            var arrival_date = $('#arrivaldate').val();
            var offer = $('#offer').val();
            var dateArrival = new Date(arrival_date);
            if(arrival_date=='' || offer==''){
                alert('please fill the fields');
            }
            if(offer == '1'){
                if(dateArrival <= new Date('2016-04-01') || dateArrival >= new Date('2016-04-25') ){
                    alert('White Offer Not Valid');
                }else{
                    alert('White Offer Valid');
                }
            }else if(offer == '2' && arrival_date!=''){
                if(dateArrival <= new Date('2016-04-20') || dateArrival >= new Date('2016-05-15') ){
                    alert('Black Offer Not Valid');
                }else{
                    alert('Black Offer Valid');
                }
            }
        });
    });
</script>

<form id="demoform">
    <div>
        Arrival Date: <input type="text" id="arrivaldate" class="form-control" data-provide="datepicker" style="width:200px"/>
    </div>
    <br/>
    <div>
        Offers:
        <select id="offer" class="form-control" style="width:200px">
            <option value="0">None</option>
            <option value="1">White Offer</option>
            <option value="2">Black Offer</option>
        </select>
    </div>
    <br/>
    <div>
        <button class="btn btn-info" type="button" id="btn">Submit</button>
    </div>
</form>

Javascript验证依赖于日期的下拉菜单

1 个答案: