セレクトボックス内の値をクリックした時にそのindexをアラート表示する。
デモ
コード.gs
function doGet() {
return HtmlService.createHtmlOutputFromFile("index");
}
|
意訳この機能がやること 指定したHTMLファイルを表示する |
index.html
<!DOCTYPE html>
<html>
<body>
<select id="voiceSelect"></select>
<script>
document.getElementById("voiceSelect").onclick = getVoiceIndex
speechSynthesis.onvoiceschanged = getVoices;
var voices;
function getVoices() {
voices = speechSynthesis.getVoices();
var select = document.getElementById("voiceSelect");
var values = "";
for(var i = 0; i < voices.length ; i++) {
var option = document.createElement('option');
var lang = voices[i].lang;
var value = voices[i].name
option.textContent = value;
option.setAttribute('data-lang', voices[i].lang);
option.setAttribute('data-name', voices[i].name);
select.appendChild(option);
}
select.setAttribute('size', 12);
}
function getVoiceIndex() {
var name = document.getElementById("voiceSelect").value;
var voiceIndex;
for(var i = 0; i < voices.length; i++) {
if(voices[i]["name"] === name) {
voiceIndex = i;
break;
}
}
alert(voiceIndex);
}
</script>
</body>
</html>
|
