JS修改按钮样式
目录:
1. 描述
2. 示例首先在报表中给A1~A7单元格添加按钮控件， 然后分别给A1~A6单元格控件添加点击JS事件，最后在A7单元格(控件)展示其对应的效果。如下图：
注：给A7单元格控件定义控件名：BUTTON
注：按钮在页面中的排布顺序为从上到下，从左到右。
给A1单元格控件添加点击事件。
$('.fr-btn-text').eq(6).css('color','red'); //使得第7个按钮名称颜色变为红色：
注：修改指定按钮用的是jQuery的eq(index)选择器，index的值是从0开始的，所以eq(6)获取到的是页面中第7个按钮。
同理：给A2~A6控件设置点击事件。
A2单元格控件JS脚本：
$('.fr-btn-text').eq(6).css('font-size','20px'); $('.fr-btn-text').eq(6).css('height','25');//使得第7个按钮名称字体变为20px，按钮文本高度默认为16px，如果字体大小超过文本高度会显示不全，需要调整按钮文本高度
A3单元格控件JS脚本：
$('.fr-btn-text').eq(6).css('font-style','italic'); //使得第7个按钮名称字体倾斜
A4单元格控件JS脚本:
//使得第7个按钮名称居左显示
$('#fr-btn-BUTTON').css('text-align','left');
A5单元格控件JS脚本:
$('.fr-btn-up').eq(6).css('background','#8AC007');//按钮背景色
$('.fr-btn-up').eq(6).css('border-radius','20px');//使得第7个按钮背景变为绿色圆角
A6单元格控件JS脚本:
$('.fr-btn-up').eq(6).css('height','20'); $('.fr-btn-up').eq(6).css('width','50');
//使得第7个按钮背景变小
2.1 保存与预览
保存报表，以填报模式预览，效果如上图。
2.2 移动端效果
移动端H5解析，如图：
注：移动端APP不支持。
附件列表
文档内容仅供参考，如果你需要获取更多帮助，付费/准付费客户请咨询帆软技术支持
关于技术问题，您还可以前往帆软社区，点击顶部搜索框旁边的提问按钮
若您还有其他非技术类问题，可以联系帆软传说哥（qq：1745114201）