みかづきブログ その3

3ヶ月つづけてみました。

JavaScriptでテキストの選択範囲を抽出し読み上げる

kimizuka.hatenablog.com

以前、 JavaScriptでテキストの選択範囲を抽出したこと がありましたが、今回は抽出した部分を読み上げるように改良してみました。
音声合成APIを使っていますが、長文を読み上げることができなかったため、句読点で区切って読み上げています。

Javascript

(function(win, doc) {

  "use strict";

  win.addEventListener("mouseup", _handleMouseup, true);

  function _handleMouseup() {
    var txt = win.getSelection().toString(),
      txtList, msg;
    
    if (txt) {
      txtList = txt.split(/、|。/);

      setTimeout(function() {
        for (var i = 0, length = txtList.length; i < length; i++) {
          msg = new SpeechSynthesisUtterance(txtList[i]);
          msg.lang = "ja-JP";
          speechSynthesis.speak(msg);
        }
      }, 500);
    }
  }

})(this, document);

DEMO

※ Chromeにてご確認ください