JavaScript——問卷星自動填寫

一、前言：

　　我們學校要刷學術章，有些學術章又是指定在某個時間點填寫問卷星的問卷報名的。但是由於我手速慢，導致總會有些時候報不上名，於是想着搞個代碼實現自動填寫問卷星的報名表。一頓操作后，在github上找到了比較合適的源碼，修改一些代碼后，就可以實現問卷星自動填寫！參考地址：https://github.com/wkmyws/wjxJS

　　博主環境：win10 64 + 谷歌瀏覽器

 　　要實現在瀏覽器上運行javascript代碼，有以下兩種方式：

　　①在問卷星頁面直接F12打開控制台，然后控制台粘貼提前寫好的javascript代碼，回車運行即可！但是這種方法，速度慢，不太可取（因為要每次先打開問卷星填寫頁面，然后再去打開控制台，然后再粘貼，然后......，時間都過了不少了，或許別人都填好提交了o(╥﹏╥)o）

　　②在谷歌瀏覽器插入油侯腳本，可以使瀏覽器自動運行js腳本程序。這種方法速度快，效果穩定，下面將使用該方法進行測試！

二、配置+測試

1. 谷歌瀏覽器插入油侯腳本

1.1 油侯腳本是一款免費的瀏覽器擴展和最為流行的用戶腳本管理器，增強了用戶對瀏覽體驗的控制權。油侯腳本下載地址：http://www.tampermonkey.net/

1.2 安裝過程：

　　①在chrome瀏覽器右上角點開 豎三點 —> 更多工具 —> 擴展程序

　　②在擴展程序頁面，打開開發者模式

　　③點擊 加載已解壓的擴展程序 ，選擇下載解壓后的文件夾

　　

　　　　注意：下載解壓后的油侯腳本最好不要放在谷歌瀏覽器默認擴展程序位置，否則重啟后油侯腳本可能會被瀏覽器清除掉！建議油侯腳本文件放在自定義位置！

　　④安裝完成后，谷歌瀏覽器右上角會顯示油侯腳本圖標

　　

 　　

2. 測試

2.1 自動填寫問卷星

1.測試代碼如下：（支持問卷星的input、radio、checkbox，僅支持填寫）

// ==UserScript==
// @name         問卷星測試——支持input radio checkbox
// @version      1.1
// @description  測試
// @author       蛋片雞
// @match        https://www.wjx.top/*
// @match        https://www.wjx.cn/*
// @grant        none
// @require      https://code.jquery.com/jquery-3.4.1.min.js
// ==/UserScript==


/*
**info 第一個參數:對應的填入選項（字符串）
**info 第二個參數:匹配的標題（正則表達式）
**info 第三個參數:(可選)，當答題框為單選|多選時匹配的選項（正則表達式）
*/

(function() {
    'use strict';
    const info=[
        ["蛋片雞",/(姓名)|(名字)/],
        ["18711111",/(學號)/],
        ["單選框_性別",/(性別)/,/(男)|(男生)/],
        ["單選框_年級",/(年級)/,/(18級)|(2018級)/],
        ["機自學院",/(學院)/],
        ["計算機",/(專業)/],
        ["11011001100",/(聯系方式)|(電話)|(手機)|(手機號)/],
        ["[e-mail]",/(QQ)|(qq)/]
    ];
    const ini={
        module:".div_question",//每個問題模塊
        title:".div_title_question",//標題
        type:{
           "input_text":".inputtext",
           "radio":".ulradiocheck",
           "checkbox":".ulradiocheck"
        }
    };
    $(document).ready(function(){
        let itemNum = 0;
        $(ini.module).each(function(){
            itemNum += 1;
            let title=$(this).find(ini.title).text();
            //判斷類別
            for(let i=0;i<info.length;i++){//匹配用戶信息
                if(info[i][1].test(title)){//匹配到一處信息,判斷答題框類型,加break！
                   for(let tp in ini.type){
                       let dom=$(this).find(ini.type[tp]);
                       if(dom.length>0){
                           switch(tp){
                               case "input_text":
                                   $("#q"+itemNum)[0].value = info[i][0]; //賦值
                                   break;
                               case "radio":
                               case "checkbox":
                                   $(this).find("li").each(function(){
                                       if(info[i].length>=3&&info[i][2].test($(this).text())){
                                           $(this).find("a").click();
                                       }
                                   });
                                   break;
                               default:console.log("ini.type中沒有匹配"+tp+"的鍵值");
                           }
                           break;
                       }
                   }
                    break;
                }
            }
        });
    });
})();

2.測試結果：

測試使用的問卷星鏈接：https://www.wjx.top/jq/46606239.aspx

2.2 自動填寫並提交問卷星

1.測試代碼如下：（支持填寫並提交功能）

// ==UserScript==
// @name         問卷星測試——支持input radio checkbox
// @version      1.1
// @description  測試
// @author       FHC
// @match        https://www.wjx.top/*
// @match        https://www.wjx.cn/*
// @grant        none
// @require      https://code.jquery.com/jquery-3.4.1.min.js
// ==/UserScript==


/*
**info 第一個參數:對應的填入選項（字符串）
**info 第二個參數:匹配的標題（正則表達式）
**info 第三個參數:(可選)，當答題框為單選|多選時匹配的選項（正則表達式）
*/

(function() {
    'use strict';
    const info=[
        ["蛋片雞",/(姓名)|(名字)/],
        ["18711111",/(學號)/],
        ["單選框_性別",/(性別)/,/(男)|(男生)/],
        ["單選框_年級",/(年級)/,/(18級)|(2018級)/],
        ["機自學院",/(學院)/],
        ["計算機",/(專業)/],
        ["11011001100",/(聯系方式)|(電話)|(手機)|(手機號)/],
        ["[e-mail]",/(QQ)|(qq)/]
    ];
    const ini={
        module:".div_question",//每個問題模塊
        title:".div_title_question",//標題
        type:{
           "input_text":".inputtext",
           "radio":".ulradiocheck",
           "checkbox":".ulradiocheck"
        }
    };
    $(document).ready(function(){
        let itemNum = 0;
        $(ini.module).each(function(){
            itemNum += 1;
            let title=$(this).find(ini.title).text();
            //判斷類別
            for(let i=0;i<info.length;i++){//匹配用戶信息
                if(info[i][1].test(title)){//匹配到一處信息,判斷答題框類型,加break！
                   for(let tp in ini.type){
                       let dom=$(this).find(ini.type[tp]);
                       if(dom.length>0){
                           switch(tp){
                               case "input_text":
                                   $("#q"+itemNum)[0].value = info[i][0]; //賦值
                                   break;
                               case "radio":
                               case "checkbox":
                                   $(this).find("li").each(function(){
                                       if(info[i].length>=3&&info[i][2].test($(this).text())){
                                           $(this).find("a").click();
                                       }
                                   });
                                   break;
                               default:console.log("ini.type中沒有匹配"+tp+"的鍵值");
                           }
                           break;
                       }
                   }
                    break;
                }
            }
        });
        $('.submitbutton').click();
    });
})();

 

 其實上面就是增加了一行代碼就可以進行問卷提交！

2.測試結果：

測試使用的問卷星鏈接：https://www.wjx.top/jq/46606239.aspx