如何在html页面使用js获取model里的值

JavaScript027

如何在html页面使用js获取model里的值,第1张

这个我也遇到过这个问题，我的解决方法就是讲在前端用一个标签获取到数据，然后用js去获取标签里面的属性值就好了比如这样：

<input type="hidden" th:value="${parent}"/>，然后用js获取这个输入框的值就可以了。

获取id   ${user.id}

获取name ${user.name}

获取company ${user.company}

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=0i<signInTalentIntegralRecords.lengthi++){

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 = 0i <42i++) {

_html += ' <li><div class="qiandao-icon"></div></li>'

}

$dateBox.html(_html) //生成日历网格

var $dateLi = $dateBox.find("li")       for (var i = 0i <totalDayi++) {

$dateLi.eq(i + monthFirst).addClass("date" + parseInt(i + 1))           for (var j = 0j <dateArray.lengthj++) {                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()

}

js只能获取页面上的HTML元素或AJAX返回的结果.~

如果你想要用js去获取MVC中的model或viewdata的话.

那么你必须要用方法去使得model或viewdata转换为JS能获取的对象

例如:

HTML中的<input id="x" type="hidden" value='<%: ViewData["x"].ToString() %>' />

//或许你能有更好的生成HTML标记的方法,在此我仅仅是做个示范.

然后在jQuery中

var x = $("#x").val()