<script src="http://101.35.26.18:88/static/js/jquery-3.2.1.min.js"></script>
<body ontouchstart id="totop">
<div class="container grid-sm crumbs">
</div><div class="container grid-sm post-main">
<h1 class="post-title">有声双语美文：15条关于爱情的经典名言</h1>
<ul class="post-meta">
</ul>
<article class="post-content"><ol><li>“Love is when the other person’s happiness is more important than your own.” – H. Jackson Brown, Jr.“<br>爱情就是把别人的幸福看得比自己的重要。”——杰尔逊•布朗</li><li>“You can’t blame gravity for falling love.” – Albert Einstein“<br>你不能因陷入爱情而责备重力。”——阿尔伯特•爱因斯坦</li><li>“Don’t forget to love yourself.” – Soren Kierkegaard“<br>别忘了爱你自己。”——索伦•克尔凯郭尔</li><li>“The best thing to hold onto in life is each other.” – Audrey Hepburn“<br>生活中最好的事情是拥有彼此。”——奥黛丽•赫本</li></ol></article>
</div>
<table class="table">
<tr align="center">
<td height="25">
<div id="support-message" class="support-message"></div>
<hr>
<div id="container">
<div id="text-container" style="display:none">
<label for="text-to-speech" class="custom-label">
朗读内容</label>
<textarea class="form-control" name="textToSpeech" id="text-to-speech" cols="45" rows="5">在线语音文本朗读</textarea>
<span id="speech-status" class="speech-status">播放</span>
</div>
<div class="option" style="display:none">
<label for="voice">朗读引擎</label>
<select name="voice" id="voice" class="dropdown dropdown--voice"></select>
<select hidden name="language" id="language" class="dropdown dropdown--language" aria-label="language">
<option>en-us</option>
<option>fr-fr</option>
<option>es-es</option>
</select>
</div>
<div class="option" style="display:none">
<label for="volume">音量</label>
<input type="range" min="0" max="1" step="0.1" name="volume" id="volume" value="1">
</div>
<div class="option" style="display:none">
<label for="rate">语速</label>
<input type="range"
min="0.1"
max="3"
step="0.1"
name="rate"
id="rate"
value="0.8">
</div>
<div id="buttons-container">
<button id="speak-btn">朗读</button>
<button id="pauseresume-btn">暂停</button>
<button id="cancel-btn">停止</button>
</div>
</div>
</td>
</tr>
</table>
<script type="text/javascript">
//$(".post-content").html()
var str =$(".post-content").html();
var str2 =str.replace(/<(.*?)>/gi,"");
document.getElementById("text-to-speech").value=str2 ;
</script>
<script>
/*eslint-env es6 */
(function () {
'use strict';
// Testing for browser support
const speechSynthesisSupported = 'speechSynthesis' in window;
let isPaused = false;
let isPlaying = false;
// Getting html elements
const supportMessageEle = document.getElementById('support-message');
const speakBtn = document.getElementById('speak-btn');
const pauseresumeBtn = document.getElementById('pauseresume-btn');
const cancelBtn = document.getElementById('cancel-btn');
const textToSpeechEle = document.getElementById('text-to-speech');
const voiceSelect = document.getElementById('voice');
const langSelect = document.getElementById('language');
const volumeRange = document.getElementById('volume');
const rateRange = document.getElementById('rate');
// var pitchRange = document.getElementById('pitch');
const speechStatus = document.getElementById('speech-status');
const log = function (message) {
console.log(`${message}<br/>`);
};
if (speechSynthesisSupported) {
supportMessageEle.innerHTML = '您的浏览器支持语音合成。';
} else {
supportMessageEle.innerHTML = '您的浏览器不支持语音合成。';
supportMessageEle.classList.add('unSupported');
}
// Generic function to remove all options from a select
const clearSelect = function (selectObject) {
while (selectObject.length > 0) {
selectObject.remove(selectObject.length - 1);
}
};
// Clear combobox then add voice options
const displayVoices = function (voices) {
const lastSelectedVoiceName = voiceSelect.value;
clearSelect(voiceSelect);
voices.forEach((voice) => {
const option = document.createElement('option');
option.value = voice.name;
option.innerHTML = voice.name;
option.id = voice.name;
voiceSelect.appendChild(option);
});
if (lastSelectedVoiceName && voiceSelect.options.namedItem(lastSelectedVoiceName)) {
voiceSelect.value = lastSelectedVoiceName;
}
};
// Loading available voices for this browser/platform
// And displaying them into the combobox
const loadVoices = function () {
const voices = speechSynthesis.getVoices();
if (voices.length > 0) {
displayVoices(voices);
}
};
const speak = function (textToSpeech) {
const synUtterance = new SpeechSynthesisUtterance();
synUtterance.text = textToSpeech;
if (voiceSelect.value) {
synUtterance.voice = speechSynthesis
.getVoices()
.filter(function (voice) {
return voice.name === voiceSelect.value;
})[0];
}
synUtterance.lang = langSelect.value;
synUtterance.volume = parseFloat(volumeRange.value);
synUtterance.rate = parseFloat(rateRange.value);
// synUtterance.pitch = parseFloat(pitchRange.value);
const eventList = ['start', 'end', 'mark', 'pause', 'resume', 'error', 'boundary'];
eventList.forEach((event) => {
synUtterance.addEventListener(event, (speechSynthesisEvent) => {
log(`Fired '${speechSynthesisEvent.type}' event at time '${speechSynthesisEvent.elapsedTime}' and character '${speechSynthesisEvent.charIndex}'.`);
});
});
window.speechSynthesis.speak(synUtterance);
};
if (speechSynthesisSupported) {
loadVoices();
// Chrome loads voices asynchronously.
window.speechSynthesis.onvoiceschanged = () => {
loadVoices();
};
}
if (speechSynthesisSupported) {
speakBtn.addEventListener('click', () => {
if (textToSpeechEle.value.length > 0) {
speak(textToSpeechEle.value);
}
});
pauseresumeBtn.addEventListener('click', () => {
if (!isPaused) {
window.speechSynthesis.pause();
isPaused = true;
pauseresumeBtn.textContent = '继续';
} else {
window.speechSynthesis.resume();
isPaused = false;
pauseresumeBtn.textContent = '暂停';
}
});
cancelBtn.addEventListener('click', () => {
window.speechSynthesis.cancel();
});
setInterval(() => {
if (speechSynthesis.speaking) {
speechStatus.style.visibility = 'visible';
speechStatus.style.width = '32px';
if (!isPlaying) {
speechStatus.src = 'images/playingsound.gif?_ts=1546968941668';
isPlaying = true;
}
if (speechSynthesis.paused) {
speechStatus.src = 'images/pauseicon.png?_ts=1546968941668';
isPlaying = false;
}
} else {
isPlaying = false;
speechStatus.src = '';
speechStatus.style.visibility = 'hidden';
}
}, 100);
}
}());
</script>
赏
支付宝打赏
微信打赏
支付宝打赏
微信打赏
如果文章或资源对您有帮助，欢迎打赏作者。一路走来，感谢有您！
txttool.com 说一段 esp56物联 查询128 IP查询