JS中直接从java后台获得对象的值（数组的值）

这里举得例子是：JS直接从后台Contorller中（SpringMVC中的model中）获得数值的值

Contorller 此处将 talentIntegralRecordsDay talentIntegralRecordsIntegral 两个数组用JSON.toJSONString()封装。

    @SuppressWarnings("deprecation")
    @RequestMapping("/integralParadise")
    public ModelAndView Welcome(HttpServletRequest request){
        
        Users user = userService.currentUser(request);    
        user.getTalentUser().getIntegral();
        System.out.println(user.getTime().getDate());
        
        TalentIntegralRecord[] signInTalentIntegralRecords= wechatIntegralService.getUserSignInTalentIntegralRecords(user.getId());
        int size = signInTalentIntegralRecords.length;
        int[] talentIntegralRecordsDay = new int[size];
        Long[] talentIntegralRecordsIntegral = new Long[size];
        for(int i=0;i<signInTalentIntegralRecords.length;i++){
            talentIntegralRecordsDay[i]=signInTalentIntegralRecords[i].getOperatorTime().getDate();
            talentIntegralRecordsIntegral[i]=signInTalentIntegralRecords[i].getIntegral();
        }
        Map<String,Object> map = new HashMap<String,Object>();
        map.put("talentIntegralRecordsDay", JSON.toJSONString(talentIntegralRecordsDay));
        map.put("talentIntegralRecordsIntegral", JSON.toJSONString(talentIntegralRecordsIntegral));
        return new ModelAndView("wechat/integralParadise/rili",map);
    }

 

前台JSP 因为用到两个数组数据的JS代码为页面引用的JS代码所以要在页面中先声明获得后台两个数组（这段JS代码应在引用的JS文件前面）

<script type="text/javascript"> 
    $(document).ready(function(){
        window.talentIntegralRecordsDay = ${talentIntegralRecordsDay};
        window.talentIntegralRecordsIntegral = ${talentIntegralRecordsIntegral};
    });
</script>

 

引用的JS文件 开始就获得了两个数组的值

$(function() {
    var signFun = function() {
        
        var dateArray = window.talentIntegralRecordsDay;// 假设已经签到的
        var talentIntegralRecordsIntegral = window.talentIntegralRecordsIntegral;
        var $dateBox = $("#js-qiandao-list"),
            $currentDate = $(".current-date"),
            $qiandaoBnt = $("#js-just-qiandao"),
            _html = '',
            _handle = true,
            myDate = new Date();
        $currentDate.text(myDate.getFullYear() + '年' + parseInt(myDate.getMonth() + 1) + '月' + myDate.getDate() + '日');

        var monthFirst = new Date(myDate.getFullYear(), parseInt(myDate.getMonth()), 1).getDay();

        var d = new Date(myDate.getFullYear(), parseInt(myDate.getMonth() + 1), 0);
        var totalDay = d.getDate(); //获取当前月的天数

        for (var i = 0; i < 42; i++) {
            _html += ' <li><div class="qiandao-icon"></div></li>'
        }
        $dateBox.html(_html) //生成日历网格

        var $dateLi = $dateBox.find("li");
        for (var i = 0; i < totalDay; i++) {
            $dateLi.eq(i + monthFirst).addClass("date" + parseInt(i + 1));
            for (var j = 0; j < dateArray.length; j++) {
                if (i == dateArray[j]) {
                    $dateLi.eq(i).addClass("qiandao");
                    var integral;
                    if(talentIntegralRecordsIntegral[j]==0){
                        integral="大转盘";
                    }else{
                        integral="+"+talentIntegralRecordsIntegral[j];
                    }
                    $dateLi.eq(i).find("div").text(integral);
                }
            }
        } //生成当月的日历且含已签到

        $(".date" + myDate.getDate()).addClass('able-qiandao');

        $dateBox.on("click", "li", function() {
                if ($(this).hasClass('able-qiandao') && _handle) {
                    $(this).addClass('qiandao');
                    qiandaoFun();
                }
            }) //签到

        $qiandaoBnt.on("click", function() {
            if (_handle) {
                qiandaoFun();
            }
        }); //签到

        function qiandaoFun() {
            $qiandaoBnt.addClass('actived');
            openLayer("qiandao-active", qianDao);
            _handle = false;
        }

        function qianDao() {
            $(".date" + myDate.getDate()).addClass('qiandao');
        }
    }();

    function openLayer(a, Fun) {
        $('.' + a).fadeIn(Fun)
    } //打开弹窗

    var closeLayer = function() {
            $("body").on("click", ".close-qiandao-layer", function() {
                $(this).parents(".qiandao-layer").fadeOut()
            })
        }() //关闭弹窗

    $("#js-qiandao-history").on("click", function() {
        openLayer("qiandao-history-layer", myFun);

        function myFun() {
            console.log(1)
        } //打开弹窗返回函数
    })

})