禁用jquery ui对话框

时间:2015-07-05 12:36:31

标签: javascript jquery html

我有一个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;
});

任何帮助都是最受欢迎的。

1 个答案:

答案 0 :(得分:0)

解决问题,插入&#34;否则&#34;声明+代码并删除了其他标志&#34; rpt_dlog_run&#34;设置为&#34; false&#34;。

  if ( i < 100) {
      jQuery.doTimeout(1500, function()  {
        hiliteTextAudioPlay(i);
      });
  }else{
  rpt_dlog_run = false;
  }