jQuery data() tmpl() 的一个小坑

工作中经常用 jQuery 的 data() 和 tmpl() 搭配使用,很方便。不过最近遇到一个很隐蔽的问题。

使用 data() 和 tmpl() 时,类似于 6.0 这种小数点后为零的数据都是显示为 6 这种类型的。jQuery 用了也有挺长一段时间了,这个问题之前还真得从来没有注意到。

一开始仅仅怀疑是 jQuery 的 data() 方法对字符串做了处理。测试了一下确实如此。后来发现不仅是 data() 方法, jQuery template 的 tmpl() 对字符串同样也做了处理。

看 demo ,一个是取的 #bd 上事先存好的 data-*,一个是直接给 tmpl() 传入假数据。

Source code
结果如下

5 310 133.4
5 310 133.4

可以看到 310.0 最后都是输出为 310 。

查了一下 jQuery API 文档 中有提到

Every attempt is made to convert the string to a JavaScript value (this includes booleans, numbers, objects, arrays, and null) otherwise it is left as a string. To retrieve the value’s attribute as a string without any attempt to convert it, use the attr() method.

所以如果想要以原本的格式取到字符串,还是使用 attr() 方法吧。如果需要强制把 310 显示为 310.0,只好使用 toFixed() 方法。