JavaScript实现金数据统计表全自动填表 含各种类型表单填写方式

由于疫情，每天都有身体健康表要填，非常麻烦。所以写一个JS脚本，在浏览器运行就可以实现自动填表了。

最好是电脑运行，当然脚本确认没问题了也可以复制到手机X浏览器运行脚本填写。

金数据有好多种填写表单样式，接下来一一进行解析

1.普通填空

这种最普通，在浏览器开发者模式下（按F12）选中它右键检查，找到元素ID

其中 id="entry_field_1"就是这个填写框的ID值
在下方控制台Console输入下列代码，即可修改此框内容

document.getElementById("entry_field_1").value="张三";

2.下拉选框

普通的下拉选择器，同上一个办法，右键找到元素ID值，不同的是需要展开select标签，看到下面的option标签中的内容，确定选项对应的value值，如下图

比如选择第一个选项，需要修改的value值为NLsD，id值依然为select标签的id值

document.getElementById("entry_field_166").value = "NLsD";

或者激活对应值上绑定的change函数

$('#entry_field_166').val("NLsD").change();

3.带筛选输入框的高级下拉选框

这是升级版的下拉选框，因为选择项目太多，表单启用了筛选功能方便查找，这是一个难点。直接使用查找元素找不到select标签，不过经过苦心研究，依然发现了破解办法

使用传统的检查元素定位到的是这样的

是一个span标签，看起来无从下手，实际上这是金数据JS的一个障眼法，这个span标签只是一个显示作用，底层依然是select标签实现选择，只需将定位到的位置往上移

可以发现隐藏的select标签。依然使用上题的函数即可

document.getElementById('entry_field_41').value = "sZxB"

这里需要注意，修改完后页面上依然是请选择的字样，不用担心，因为这个select标签不显示，鼠标移到这个标签上可以看到

这个标签只占一个1*1大小的位置，本来就是不显示的，只要设置了select标签的值，实测提交后后台可以正确收到值，前提是value值没有填错！
如果需要修改显示值可以使用

document.getElementById('select2-entry_field_41-container').innerHTML = '输入显示值'

注意这里getElementById函数的值为span标签的id值，显示值不影响提交和验证

4. 地区下拉选框（多级下拉选框）
   
   这种选框有一个限制就是必须先选择上一个选框后下一个选框的值才会出现，这种不能使用修改value值的方式，需要激活绑定的change函数才行

$('#entry_field_6_province').val('北京市').change();
$('#entry_field_6_city').val('北京市').change();
$('#entry_field_6_district').val('朝阳区').change();

三行代码顺序不能错，注意val值不能填写错

5. 多项选择/复选框
   
   
   类似这种选项，都属于同一个class类就是selected-icon
   先获取到所有这种selected-icon元素

var is = document.getElementsByClassName("selected-icon");

选择单独一个可以直接激活对应位置的click函数

is[10].click();

多项可以循环依次选择，跳过不选的项目

for(i = 12 ; i < 33 ; i++){
    is[i].click();
    i = i + 1;
}

6. 日期
   
   虽然是选择日期，本质还是一个输入框，可以直接填值

document.getElementById("entry_field_13").value="2020-02-"+Date()[8]+Date()[9];

可以生成一个Date对象来获取当前的时间

7. 地图
   
   地图比较复杂，但有搜索功能，可以简化成按钮->文本框->按钮。
   实测需要注意，点击获取位置后，页面需要一定的时间来加载当前位置，如果顺序执行，后面文本框和按钮无法顺利执行，需要设定一个定时器，等待一秒，等定位加载完成后再修改位置。

//定位
document.getElementsByClassName("gd-icon-map-marker")[0].click();
setTimeout("dingwei()",1000);


function dingwei()
{
document.getElementsByClassName("map-search fixed-width-control")[0].value="广东省深圳市";
document.getElementsByClassName("add-on map-search-btn")[0].click();
}

8.提交按钮

这个最简单，激活绑定的click函数即可，因为此项没有ID值，需要定位Class元素来选择，因为getElementsByClassName是得到一个数组，所以第一项就是提交按钮（只会得到一个长度为1的数组，因为页面没有第二个提交按钮）
注意：如果你的问卷有获取地理位置的选项，请将提交按钮代码放在定时器里面执行

//提交
document.getElementsByClassName('submit gd-btn gd-btn-primary-solid  font-family-inherit with-shadow')[0].click();

将上述代码一一实现好后，可以一次性复制粘贴到开发者模式的Console控制台运行，即可实现全自动填表