本帖最后由 橘猫今天喝水了吗 于 2025-1-6 17:13 编辑
下拉框吗？ 感觉可以通过appendCss来实现， 获取选框对象，设置onmouseover等属性。 有空了我试试
---20250106 更新
可以通过onmouseover属性实现，方法是通过获取选项内容标签，逐个增加属性，但是由于下拉框的组件是在点击下拉框后才会生成下拉列表，宏没有很好的类型来对应。只能通过先点击下拉框，生成选项之后，刷新页面，才会让宏里的操作生效。
这个方案pass掉。
最终办法是通过修改全局属性：增加hover属性实现。
创建客户端宏，(打开报表后或者每次刷新后都行)
代码实现过程如下：
版本1：
function main(spreadsheetReport) {
var style = document.createElement('style'); //创建style
style.type='text/css';
var css = `
.dropdown-box-span-select:hover {
background-color:red
}
`
style.appendChild(document.createTextNode(css));
document.head.appendChild(style);
}
版本1代码说明：
首先创建一个style标签，再创建css内容。
css内容中: 【.dropdown-box-span-select】 是class选择器，我使用的是电子表格里的下拉框参数，下拉框中鼠标选中的标项的class会被系统修改为class='dropdown-box-span-select' （未被鼠标指向的项为dropdown-box-span）。
然后通过css设置 hover(鼠标指向时的属性) 的 background-color:red （背景颜色为红色）也可以设置其他样式内容。
缺点：由于document设置的是当前浏览器页面的全局属性，所以其他电子表格也会收到影响。
针对这个问题，修改代码，得到了版本2
版本2代码如下：
function main(spreadsheetReport) {
var style = document.createElement('style'); //创建style
style.type='text/css';
var css = `
table[class*='Iff808081019390ff90ff41ec01942ad3c4a2570c'] .dropdown-box-span-select:hover {
background-color:red
}
`
style.appendChild(document.createTextNode(css));
document.head.appendChild(style);
}
版本2代码说明：
需要限制修改样式的内容只限于当前电子表格，那么需要根据id等唯一属性来限制，通过观察网页元素源码，看到了与当前电子表格相关的限制，在table标签里，有class的值中包含了电子表格属性中id。
（背景：Iff808081019390ff90ff41ec01942ad3c4a2570c 是我的电子表格的属性中id，也是全局资源唯一id。）
在版本1的基础上增加了一个祖先筛选table[class*='Iff808081019390ff90ff41ec01942ad3c4a2570c']
table[class*='电子表格的id'] ：效果是筛选class名称中包含当前电子表格id的table标签。
后边空格再跟上.dropdown-box-span-select:hover
整体意思是祖先标签是class含Iff808081019390ff90ff41ec01942ad3c4a2570c的table，这个table下的class是dropdown-box-span-select 的元素，设置其hover属性
你需要注意的变量：
1.table: 内容应该都是在table中，如果你看网页源码，发现电子表格的内容标签的祖先们之中没有table，那你需要找到跟电子表格属性中id有关的最外层的那个标签， 形式如
class ='xxxxxx xxxIff808081019390ff90ff41ec01942ad3c4a2570c_xxx xxx' ... > 根据判断修改祖先标签
2.dropdown-box-span-select：我用电子表格的下拉框组件测试的，下拉框选项的class是这个，你可以根据实际情况来过滤其他class
3.background-color:red： 修改背景颜色为红色，这个可以替换或者增加其他属性。
| 
