我正在尝试将与特定单词相关联的音频文件连续播放,同时播放音频时单个单词为hilited,并且事件之间有短暂的延迟。我希望对页面中的每个单词重复此过程。这是html的一部分:
<p id="pathVar">/templates/beez_20/audio/word_sets/word_set1/</p>
<p class="wordSetNum">1</p>
<div id="word_learning">
<p id="title">Word Learning 1</p>
<div id="centering">
<div id="left_col">
<p class="word_learn">1<span class="color_up audio" id="b1e1">the</span> คำนำหน้านามเจาะจง </span></p>
<p class="word_learn">2<span class="color_up audio" id="b1e2">and</span> และ </span></p>
<p class="word_learn">3<span class="color_up audio" id="b1e3">of</span> ของ </span></p>
<p class="word_learn">4<span class="color_up audio" id="b1e4">to</span> ถึง </span></p>
<p class="word_learn">5<span class="color_up audio" id="b1e5">a</span> หนึ่ง </span></p>
等。这是js:
"use strict";
jQuery.noConflict();
jQuery(document).ready(function() {
alert("1st");
jQuery("div#word_learning").click(function (evnt) {
alert("2nd");
var pathVar = document.getElementById("pathVar").innerHTML,
setNum = document.getElementById("setNum").innerHTML,
audioElement = document.createElement("audio"),
audioType = Modernizr.audio.ogg? ".ogg": ".mp3";
jQuery("p.word_learn").each(function(i) {
jQuery(this).css("color : red;");
audioElement.src = pathVar+"b"+setNum+"e"+i+audioType;
jQuery(this).delay(250);
audioElement.load();
audioElement.play();
jQuery(this).delay(500);
jQuery(this).css("color : black;");
});
});
});
加载页面时会显示第一个警报,但是当单击列表中的初始单词时,第二个警报不会显示。我将不胜感激任何帮助。在