zc100/template/pc/common/include/step.htm

<!-- Javascript -->
<?php
/*
 * <script src="/template/pc/js/botstrap-step/jquery-1.11.1.min.js"></script>
 */
?>
<script src="/template/pc/js/botstrap-step/bootstrap.min.js"></script>
<script src="/template/pc/js/botstrap-step/jquery.backstretch.min.js"></script>
<script src="/template/pc/js/botstrap-step/retina-1.1.0.min.js"></script>
<script src="/template/pc/js/botstrap-step/scripts.js"></script>

<!--[if lt IE 10]>
<script src="/template/pc/js/botstrap-step/placeholder.js"></script>
<![endif]-->

<!--时间组件-->
<script type="text/javascript" src="/template/pc/js/botstrap-step/moment.min.js"></script>
<script type="text/javascript" src="/template/pc/js/botstrap-step/daterangepicker.js"></script>
<script>
    $(function() {
        $(".daterange input").each(function() {
            var $this = $(this);

            $this.daterangepicker({
                locale : {
                    //"format" : "YYYY-MM",// 显示格式 //YYYY-MM-DD
                    "separator" : " / ",// 两个日期之间的分割线
                    // 中文化
                    "applyLabel" : "确定",
                    "cancelLabel" : "取消",
                    "fromLabel" : "开始",
                    "toLabel" : "结束",
                    "daysOfWeek" : [ "日", "一", "二", "三", "四", "五", "六" ],
                    "monthNames" : [ "一月", "二月", "三月", "四月", "五月", "六", "七月", "八月", "九月", "十月", "十一月", "十二月" ],
                    "firstDay" : 1,
                    "defaultDate": new Date(),
                    "format": 'YYYY', // 设置年份格式
                },
                startDate: moment(),
                endDate: moment(),
                minView: "years", // 设置最小视图为年份
                maxView: "years", // 设置最大视图为年份
                showDropdowns: true,
                singleDatePicker: true,
                opens: 'right', //日期选择框的弹出位置
            }, function(start, end, label) {
                // 点击确定后的事件，下面是为了bootstrap validate得校验，
                // 若未使用，可忽视
                if ($this.parents("form.required-validate").length > 0) {
                    var $form = $this.parents("form.required-validate");

                    var name = $this.attr("name");
                    if ($form.length > 0) {
                        var data = $form.data('bootstrapValidator');
                        data.updateStatus(name, 'NOT_VALIDATED', null)
                            // Validate the field
                            .validateField(name);
                    }
                }
                // 设置最小宽度，否则显示不全
            }).css("min-width", "210px").next("i").click(function() {
                // 对日期的i标签增加click事件，使其在鼠标点击时可以拉出日期选择
                $(this).parent().find('input').click();
            });
        });
    });
</script>

<script>
    //获取手机验证码
    /*
    erDiagram
    User -->> Button: 点击
    Button -->> Frontend: 发送请求
    Frontend -->> Backend: 请求验证码
    Backend -->> User: 发送验证码
    User -->> Input: 输入验证码
    Input -->> Frontend: 提交验证码
    Frontend -->> Backend: 验证验证码
     */

    $(function(){
        /**
         * 点击按钮开始倒计时
         * @param obj 倒计时操作的文档对象
         * @param countdown 倒计时时间
         */
        function setTime(obj, countdown) {
            if (countdown == 0) {
                obj.prop('disabled',false);
                obj.addClass('get-code-hover');
                obj.html("获取验证码");
                return;
            } else {
                obj.prop('disabled', 'disabled');
                obj.removeClass('get-code-hover');
                obj.html("重新发送(" + countdown + ")");
                countdown--;
            }
            setTimeout(function() {
                setTime(obj, countdown);
            }, 1000)
        };

        // 使用正则表达式验证手机号码
        function isValidPhoneNumber(phoneNumber) {
            var regex = /^1[3-9]\d{9}$/; // 中国手机号码正则表达式，以1开头，第二位是3-9，后面跟着9位数字
            return regex.test(phoneNumber);
        }


        $(document).on('click','#retrieve-code',function (){


            //验证手机号码
            var phoneNumber = $('#per-phone').val();
            if (isValidPhoneNumber(phoneNumber)) {
                console.log("手机号码有效");
            } else {
                console.log("手机号码无效");
                $('#myModal .modal-body p').html('手机号码无效');
                $('#myModal').modal('show');
                return false;
            }

            // 显示加载状态
            $('#loadingModal .visually-hidden').html('发送中...');
            $('#loadingModal').modal('show');

            // 点击事件调用倒计时函数
            setTime($('#retrieve-code'),120);
            //return false;
            //请求ajax 发送短信
            // 发送 AJAX 请求
            $.ajax({
                url: '/api/Diyajax/getCode',
                data: {
                    'mobile' : phoneNumber,
                },
                method: 'GET',
                success: function(data) {
                    // 请求成功后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理返回的数据
                    console.log('Ajax response:', data);

                    $('#loadingModal .visually-hidden').html(data.msg);
                    $('#loadingModal').modal('show');
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                    }, 3000); // 5秒后取消定时器

                },
                error: function(xhr, status, error) {
                    // 请求失败后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理错误
                    console.error('Ajax error:', status, error);
                }
            });
        });


        $(document).on('click','#cx-rel-code',function (){


            //验证手机号码
            var phoneNumber = $('#ffnp').val();
            if (isValidPhoneNumber(phoneNumber)) {
                console.log("手机号码有效");
            } else {
                console.log("手机号码无效");
                $('#myModal .modal-body p').html('手机号码无效');
                $('#myModal').modal('show');
                return false;
            }

            // 显示加载状态
            $('#loadingModal .visually-hidden').html('发送中...');
            $('#loadingModal').modal('show');

            // 点击事件调用倒计时函数
            setTime($('#cx-rel-code'),120);
            //return false;
            //请求ajax 发送短信
            // 发送 AJAX 请求
            $.ajax({
                url: '/api/Diyajax/getCode',
                data: {
                    'mobile' : phoneNumber,
                },
                method: 'GET',
                success: function(data) {
                    // 请求成功后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理返回的数据
                    console.log('Ajax response:', data);

                    $('#loadingModal .visually-hidden').html(data.msg);
                    $('#loadingModal').modal('show');
                    setTimeout(function() {
                        $('#loadingModal').modal('hide');
                    }, 3000); // 5秒后取消定时器

                },
                error: function(xhr, status, error) {
                    // 请求失败后隐藏加载状态
                    $('#loadingModal').modal('hide');
                    // 处理错误
                    console.error('Ajax error:', status, error);
                }
            });
        });

        //选择地区
        $("#choose1").change(function (){

            var id = $(this).val();
            if(id > 0) {
                //发送请求
                $('#loadingModal').modal('show');
                $.ajax({
                    url: '/api/Diyajax/getZcList',
                    method: 'POST',
                    dataType: 'json', // 指定响应数据为JSON
                    data: {
                        id : id
                    },
                    success: function(data) {
                        // 请求成功后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理返回的数据
                        console.log('Ajax response:', data);
                        console.log(data.data);
                        var html = '<option value="0">选择申报专业</option>';
                        $.each(data.data,function (i,e){
                            console.log(e);
                            html += '<option value="'+e.id+'">'+e.title+'</option>';
                        });
                        $('#choose2').empty();
                        $('#choose2').append(html);
                    },
                    error: function(xhr, status, error) {
                        // 请求失败后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理错误
                        console.error('Ajax error:', status, error);
                    }
                });
            }

        });

        //选择专业 触发等级
        $("#choose2").change(function (){

            var id = $(this).val();
            if(id > 0) {
                //发送请求
                $('#loadingModal').modal('show');
                $.ajax({
                    url: '/api/Diyajax/getZcDjList',
                    method: 'POST',
                    dataType: 'json', // 指定响应数据为JSON
                    data: {
                        id : id
                    },
                    success: function(data) {
                        // 请求成功后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理返回的数据
                        console.log('Ajax response:', data);
                        console.log(data.data);
                        var html = '<option value="0">选择申报等级</option>';
                        $.each(data.data,function (i,e){
                            console.log(e);
                            html += '<option value="'+e.id+'">'+e.title+'</option>';
                        });
                        $('#choose3').empty();
                        $('#choose3').append(html);
                    },
                    error: function(xhr, status, error) {
                        // 请求失败后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理错误
                        console.error('Ajax error:', status, error);
                    }
                });
            }

        });


        /*
        * 选择省份 触发城市
        *
        * */
        $("#choose11").change(function (){

            var id = $(this).val();
            if(id > 0) {
                //发送请求
                $('#loadingModal').modal('show');
                $.ajax({
                    url: '/api/Diyajax/getCsList',
                    method: 'POST',
                    dataType: 'json', // 指定响应数据为JSON
                    data: {
                        id : id
                    },
                    success: function(data) {
                        // 请求成功后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理返回的数据
                        console.log('Ajax response:', data);
                        console.log(data.data);
                        var html = '<option value="0">选择城市</option>';
                        $.each(data.data,function (i,e){
                            console.log(e);
                            html += '<option value="'+e.id+'">'+e.name+'</option>';
                        });
                        $('#choose12').empty();
                        $('#choose12').append(html);
                    },
                    error: function(xhr, status, error) {
                        // 请求失败后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理错误
                        console.error('Ajax error:', status, error);
                    }
                });
            }

        });



        //选择学历 触发专业判断  无法进行判断
        /*
        $("#choose5").change(function (){
            var a = $('#choose2').val();
            var id = $(this).val();
            if(id > 0) {
                //发送请求
                $('#loadingModal').modal('show');
                $.ajax({
                    url: '/api/Diyajax/getZyList',
                    method: 'POST',
                    dataType: 'json', // 指定响应数据为JSON
                    data: {
                        'zcid' : a,
                        'xlid' : id
                    },
                    success: function(data) {
                        // 请求成功后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理返回的数据
                        console.log('Ajax response:', data);
                        console.log(data.data);
                        var html = '<option value="0">选择申报等级</option>';
                        $.each(data.data,function (i,e){
                            console.log(e);
                            html += '<option value="'+e.id+'">'+e.title+'</option>';
                        });
                        $('#choose3').empty();
                        $('#choose3').append(html);
                    },
                    error: function(xhr, status, error) {
                        // 请求失败后隐藏加载状态
                        $('#loadingModal').modal('hide');
                        // 处理错误
                        console.error('Ajax error:', status, error);
                    }
                });
            }
        });*/



    });
</script>