[英]Disabling a jquery ui dialog
我有一个jquery ui对话框,该对话框显示在单击按钮时。 此对话框包含三个按钮(真棒字体的图标),单击任何一个按钮时,都会运行一个单词列表,依次突出显示每个单词并播放其关联的音频文件。 单击对话框中的三个按钮之一时,必须关闭(或隐藏)对话框,以便用户可以在基础页面上看到单词列表。 这部分工作正常,但是我发现困难的是在播放任何一个单词列表时如何禁用控制对话框的按钮。 这对于防止同时播放多个单词列表很有必要。 我尝试使用一个标志-rpt_dlog_run-但我无法正确理解逻辑,但我认为这可能是错误的方法。 这是html:
<div id="ws_title"><p class="title_items">Word Set 1
<a class="btn_repeat" href="#"><span class="fa fa-repeat fa_repeat_ws"></span></a>
和jQuery代码:
jQuery(document).ready(function() {
var rpt_dlog_run = false;
var ws_repeat_dlog = jQuery("div#ws_repeat_dialog").dialog({
autoOpen: false,
modal: true,
position: "center",
resizable: false,
dialogClass: "ws_repeat",
draggable: false,
create: function() {
jQuery(this).parents(".ui-dialog")
.css("border", "1px solid #0000C6")
/* ..... various other css settings ..... */
.find(".ui-dialog-header")
.css("display","none")
.css("font-size", "1.2em");
}
});
jQuery("a.btn_repeat").on("click", function(evnt) {
div#ws_title
if(!rpt_dlog_run) {
evnt.stopPropagation();
ws_repeat_dlog.dialog("open");
var modal_content ='<div id="ws_repeat_modal">
/* .... content of dialog html ....*/
</div>';
ws_repeat_dlog.append(modal_content);
jQuery("p#ws_rpt1").on("click", function (evnt) { // NB needs to be changed, move to dialog box
rpt_dlog_run = true;
evnt.stopPropagation();
ws_repeat_dlog.dialog("close");
var engWords = jQuery("span.audio"),
pathVar = document.getElementById("pathVar").innerHTML,
audioElement = document.createElement("audio"),
audioType = Modernizr.audio.ogg? ".ogg": ".mp3",
i = 0;
audioPlay(i);
audioElement.addEventListener( "ended", function() {
i = i + 2; //i++; this is a real kludge, but it will do to save time
if ( i < 100) {
jQuery.doTimeout(1500, function() {
audioPlay(i);
});
}
});
function audioPlay(i) {
var wordList = jQuery("span#"+engWords[i].id),
audioPath = pathVar+engWords[i].id+audioType;
wordList.addClass("set_font_green");
audioElement.src = audioPath;
audioElement.play();
jQuery.doTimeout(1500, function() {
wordList.removeClass("set_font_green");
});
}
rpt_dlog_run = false;
});
}
});
/* before closing, empty contents of dialog to avoid content repetition */
ws_repeat_dlog.dialog({
beforeClose: function( ) {
ws_repeat_dlog.empty();
}
});
rpt_dlog_run = false;
});
任何帮助将是最欢迎的。
解决问题,插入“ else”语句+代码,并删除其他设置为“ false”的标志“ rpt_dlog_run”。
if ( i < 100) {
jQuery.doTimeout(1500, function() {
hiliteTextAudioPlay(i);
});
}else{
rpt_dlog_run = false;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.