在Thymeleaf中的JavaScript⾥调⽤后端传递的变量的⽅法
⼀句话回答就是:
⽤两个中括号括起来, ⽐如这样[[${page.isFirst()}]]就可以直接获取后端传来的page.isFirst()的值了~
我在使⽤thymeleaf框架做前端的事情, 但是我希望在JavaScript脚本中使⽤后端传来的变量
因为我希望在分页中, 能实现当⽬前处于第⼀页时, previous按钮⾃动变成disabled状态, 当⽬前处于最后⼀页时, next按钮⾃动变成disabled状态, 这需要由js来动态地改变按钮的样式(我这⾥套了bootstrap框架, 所以我改变的是class)
<script th:inline="javascript">
$(function(){
var isFirst =[[${page.isFirst()}]];
var isLast =[[${page.isLast()}]];
if(isFirst)$("#previous").addClass("disabled");
else$("#previous").removeClass("disabled");
if(isLast)$("#next").addClass("disabled");
else$("#next").removeClass("disabled");
})
</script>
这样的确就实现了代码, 但是后来经过学习发现这样的⽅法只解决了我的燃眉之急…还有⼀些缺陷;
当后端并没有传送数据过来的时候, 解析就会出现错误;
所以采取了这篇博⽂提供了解决⽅案:
类似代码如下:
<script th:inline="javascript">
/*<![CDATA[*/
.
..
var username =/*[[${session.user.name}]]*/'Sebastian';
...
/*]]>*/
</script>
⾸先, 这样的代码在编译静态页⾯是完全没有问题的, 就会⽤Sebastian来代替从后端取到的值;
如果这个⽹页被Thymeleaf解析了, 那么就会⽤注释⾥的/*[[${session.user.name}]]*/替换掉后⾯的值;
⽽且thymeleaf引擎还会⾃动解析后端传过来的值, 以求与js中的变量类型相适配, 所以基本不⽤担⼼类型转换的问题, 有下⾯这些类型: Strings
Numbers
Booleans
Arrays
Collections
Maps
Beans (objects with getter and setter methods)
thyme其次, 这⾥⽤CDATA这样的注释原因在于:
所有 XML ⽂档中的⽂本均会被解析器解析。
只有 CDATA 区段(CDATA section)中的⽂本会被解析器忽略。
术语 CDATA 指的是不应由 XML 解析器进⾏解析的⽂本数据(Unparsed Character Data)。
在 XML 元素中,"<" 和 “&” 是⾮法的。
“<” 会产⽣错误,因为解析器会把该字符解释为新元素的开始。
“&” 也会产⽣错误,因为解析器会把该字符解释为字符实体的开始。
某些⽂本,⽐如 JavaScript 代码,包含⼤量 “<” 或 “&” 字符。为了避免错误,可以将脚本代码定义为 CDATA。CDATA 部分中的所有内容都会被解析器忽略。
CDATA 部分由 “<![CDATA[" 开始,由 "]]>” 结束:
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论