京东“加关注”代码“ID必须以zx开头”的解决方法

京东的“加关注”相当于淘宝中的“收藏”功能一样，很重要，很常用。京东提供了一个加关注的velocity方法，如下：

$!jshopCommon.addFavorites(skuId)

但是它有一点不好，他会在生成的DOM中添加一段如下的属性：

<input type="button" class="btn-coll" id="collSKUID" value="加关注" style="width:auto!important;" />

注意那一段紫色的代码，给一个width:auto!important; 史上最高权重的CSS，让你直接无法修改该按钮的宽度。我一直不能明白京东的前端为何有此一举！相信，在做京东的设计师也遇到了此类的问题，当你的设计无法被完美展示出来时，相信你必定很痛苦。下面给一个解决的方法

 

不用$!jshopCommon.addFavorites，改用手动录入加关注的代码，如下：

#set($id = "coll" + $!goods.goodsId)
<input type="button" class="btn-coll" id="$!id" value="加关注" />

注意，此处的id属性值并不是以zx开头，以确保能正确的被关注。同时也绕过了ID必须以zx开头的验证规则。此法纯属投机取巧，指不准哪天就不OK了。。。建议京东的前端去掉那一段“强制auto宽度的代码”吧。