jQuery如何使用dequeue()？代码示例

dequeue()是jQuery中的内置方法, 用于从队列中删除下一个函数, 然后它将执行该函数。在队列中, 将有几个函数在等待运行dequeue(), 该队列用于从队列中删除顶部函数并执行该函数。

语法如下：

$(selector).dequeue(name);

参数：

它接受一个指定队列名称的参数"名称"。

返回值：

它返回执行给定top功能的选定元素。

jQuery代码显示此功能的工作方式：

代码1：

在下面的代码中, 动画方法也用于演示出队方法。

< html >
    < head >
       < style >
          div {
          margin: 15px 0 0 0  ;
          width: 100px;
          position: absolute;
          height: 30px;
          left: 10px;
          top: 30px;
          background-color: lightgreen;
          text-align: center;
          padding: 15px;
          }
          div.red {
          background-color: red;
          }
       </ style >
       < script src = "https://code.jquery.com/jquery-1.10.2.js" ></ script >
    </ head >
    < body >
       < div >GfG!</ div >
       <!-- click on this button to perform animation -->
       < button >Click to start !</ button >
       < script >
          $( "button" ).click(function() {
          <!--jQuery code to demonstrate animation with the help of dqueue method-->
            $( "div" )
              .animate({ left:"+=500px" }, 1000 )
              .animate({ top:"0px" }, 1000 )
              .queue(function() {
                $(this).toggleClass("green").dequeue();
              })
              .animate({ left:"50px", top:"150px" }, 1000 );
          });
       </ script >
    </ body >
</ html >

输出如下：

在点击"点击开始"按钮之前,

点击"点击开始"按钮后,

---