注音字體

打字練習器V2

請輸入參照文字

計時器: 0:00

設定說明：如何串接 Google 試算表題庫

您可以建立自己的 Google 試算表作為打字練習的題庫。請依照以下步驟設定：

建立 Google 試算表:
前往 Google Sheets 建立一份新的試算表。
開啟 Apps Script 編輯器:
在試算表選單中，點擊「擴充功能」 > 「Apps Script」。
貼上程式碼:
將編輯器中原有的程式碼清空，然後複製並貼上下方提供的完整 GAS 程式碼。儲存專案 (給它一個名稱，例如 "打字題庫")。
部署為網頁應用程式:
a. 在 Apps Script 編輯器右上角，點擊「部署」 > 「新增部署」。
b. 在「選取類型」旁點擊齒輪圖示，選擇「網頁應用程式」。
c. 在「描述」欄位可輸入一些說名，方便您日後管理。
d. 在「誰可以存取」的下拉選單中，選擇「任何人」。(這是必要步驟，否則網頁無法讀取資料)
e. 點擊「部署」。程式會自動在您的試算表中建立範例題庫，並產生一組「網頁應用程式網址」。請複製此網址。
新增您的題庫資料:
回到您的試算表，會看到一個名為「題庫」的新工作表及範例資料。您可以依照「題庫名稱」和「參照文字」的格式，新增或修改成您自己的內容。

將網址貼到本機網頁:
用文字編輯器打開這個 HTML 檔案，找到下方的 `<script>` 區塊，用您剛剛複製的網址替換掉引號中的範例網址。儲存檔案後，重新用瀏覽器開啟即可。

<script>
  // --- 設定區 ---
  // vvv 請將您發佈的 Google Apps Script 網頁應用程式網址貼在這裡 vvv
  const gasUrl = "請用您自己的網址取代這裡"; // <--- 就是改這裡
  // ^^^ 請將您發佈的 Google Apps Script 網頁應用程式網址貼在這裡 ^^^
  // --- 結束設定區 ---
  ...
</script>

Google Apps Script (GAS) 程式碼 (請完整複製)

// 當網頁透過 GET 方式請求時會執行的主要函式
function doGet(e) {
  // 每次被存取時，都先檢查試算表和工作表是否已正確設定
  setupSheet();
  
  // 取得所有題庫資料
  const data = getQuestionBanks();
  
  // 取得 JSONP 的回呼函式名稱
  const callback = e.parameter.callback;
  
  // 如果有回呼函式名稱 (代表是 JSONP 請求)，就回傳 JSONP 格式
  if (callback) {
    return ContentService
      .createTextOutput(callback + '(' + JSON.stringify(data) + ')')
      .setMimeType(ContentService.MimeType.JAVASCRIPT);
  } else {
    // 否則，回傳一般的 JSON (加上 CORS 標頭以供其他用途)
    return ContentService
      .createTextOutput(JSON.stringify(data))
      .setMimeType(ContentService.MimeType.JSON)
      .withHeaders({
        "Content-Type": "application/json; charset=utf-8",
        "Access-Control-Allow-Origin": "*",
      });
  }
}

// 取得所有題庫資料的函式
function getQuestionBanks() {
  try {
    const sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("題庫");
    // 如果工作表不存在或沒有資料，回傳空陣列
    if (!sheet || sheet.getLastRow() <= 1) {
        return { success: true, data: [] };
    }
    // 取得工作表中除了標頭以外的所有資料
    const data = sheet.getRange(2, 1, sheet.getLastRow() - 1, 2).getValues();
    
    // 將二維陣列轉換為物件陣列，方便前端使用
    const questionBanks = data.map(row => {
      // 過濾掉沒有名稱或內容的空行
      if (row[0] && row[1]) {
        return {
          name: row[0].toString().trim(),
          text: row[1].toString().trim()
        };
      }
      return null;
    }).filter(item => item !== null); // 移除空項目
    
    return { success: true, data: questionBanks };
  } catch (error) {
    // 如果發生錯誤，回傳包含錯誤訊息的物件
    return { success: false, message: "讀取試算表時發生錯誤: " + error.message };
  }
}

// 初始化設定試算表的函式
function setupSheet() {
  const spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
  const sheetName = "題庫";
  let sheet = spreadsheet.getSheetByName(sheetName);

  // 如果找不到名為 "題庫" 的工作表，就建立一個並填入範例資料
  if (!sheet) {
    sheet = spreadsheet.insertSheet(sheetName);
    
    // 設定欄位標頭
    const headers = [["題庫名稱", "參照文字"]];
    const headerRange = sheet.getRange(1, 1, 1, 2);
    headerRange.setValues(headers);
    headerRange.setFontWeight("bold"); // 將標頭設為粗體
    sheet.setColumnWidth(1, 200); // 設定第一欄寬度
    sheet.setColumnWidth(2, 600); // 設定第二欄寬度
    
    // 新增一些範例資料
    sheet.getRange(2, 1, 2, 2).setValues([
      ["範例文章一：岳陽樓記", "慶曆四年春，滕子京謫守巴陵郡。越明年，政通人和，百廢具興。乃重修岳陽樓，增其舊制，刻唐賢今人詩賦於其上。屬予作文以記之。"],
      ["範例文章二：網路佳句", "我們最大的恐懼不是我們不夠好，我們最大的恐懼是我們超乎想像的能力。我們害怕的不是我們的黑暗面，而是我們的光明面。"]
    ]);
  }
}

注音輸入法打字說明

注音字體顯示 (學習輔助)

為了方便初學者或需要對照注音的學生，本工具提供了特殊的「注音字體」顯示模式。

如何開啟：點擊頁面左上角的「注音字體」開關即可。
功能：開啟後，頁面上的所有文字（包含參照文章與您的輸入）都會變成附帶注音符號的字體，有助於學習與辨識。
提示：您也可以透過在網址後方加上 ?f=o 來預設開啟此模式。

全形／半形模式切換

在 Windows 或 macOS 中，切換中文輸入法後，您可以使用快速鍵 Shift + Space (空白鍵) 來切換全形與半形模式。

全形模式：英文字母、數字、符號都會佔用一個中文字的寬度。例如：ＡＢＣ１２３，。
半形模式：英文字母、數字、符號為標準寬度。例如：ABC 123 ,.

建議：進行本打字練習時，為了與參照文字的標點符號格式一致，請務必使用全形模式輸入標點符號。

中文標點符號輸入 (微軟注音輸入法)

在中文注音輸入法的全形模式下，您可以透過組合鍵輸入對應的標點符號。常見符號如下：

符號	名稱	方法1 (` 系列)	方法2 (`Ctrl` 系列)	方法3 (`Ctrl+Alt+,` 系列)
，	逗號	` + `,`	`Ctrl` + `,`	`Ctrl`+`Alt`+`,` 再按 `,`
。	句號	` + `.`	`Ctrl` + `.`	`Ctrl`+`Alt`+`,` 再按 `m`
、	頓號	` + `'`	`Ctrl` + `'`	`Ctrl`+`Alt`+`,` 再按 `'`
；	分號	` + `;`	`Ctrl` + `;`	`Ctrl`+`Alt`+`,` 再按 `;`
：	冒號	` + `Shift`+`;`	`Ctrl` + `Shift`+`;`	`Ctrl`+`Alt`+`,` 再按 `l`
？	問號	` + `Shift`+`/`	`Ctrl` + `Shift`+`/`	`Ctrl`+`Alt`+`,` 再按 `/`
！	驚嘆號	` + `Shift`+`1`	`Ctrl` + `Shift`+`1`	`Ctrl`+`Alt`+`,` 再按 `k`
‧	間隔號	`+`.`+`↓`選擇	`Ctrl`+`.`+`↓`選擇	`Ctrl`+`Alt`+`,` 再按 `.`
「『［【《	前引號夾注號	`+`[`+`↓`選擇	`Ctrl`+`[`+`↓`選擇	`Ctrl`+`Alt`+`,` 再按 `=`,`0`,`o`,`t`,`u`
」』］》】	後引號夾注號	`+`]`+`↓`選擇	`Ctrl`+`]`+`↓`選擇	`Ctrl`+`Alt`+`,` 再按 `\`,`-`,`p`,`y`,`i`
－… →←	連接號刪節號	`+`-`+`↓`選擇	無	`Ctrl`+`Alt`+`,` 再按滑鼠點選