如何保持不同步

我有一个要求放置在顶部&底部都在屏幕上相同的按钮2个Ladda按钮。我刚刚发现Ladda &想找到一种方法来保持这些2个Ladda按钮状态的同步。我对如何做到这一点的一些想法，但大多数是相当难看。如何保持不同步

问：如何保持2个Ladda按钮的运行状态不同步？

HTML：
两个按钮具有相同的标记。

<button class="btn btn-sm btn-next ladda-button ladda-button-success" data-style="expand-left"> 
    <span class="ladda-label">Next</span> 
    <i class="fa fa-arrow-right"></i> 
    <span class="ladda-spinner"></span> 
</button>

JavaScript事件：

btnNext: function (e) { 

    var action = that.settings.actions.next; 
    var l = Ladda.create(this); 
    l.start(); // <-- How can I "force" a start across multiple buttons? 

    // Do other stuff... 
}

来源

2017-08-03 Prisoner ZERO

如果某人有一个更雄辩的答案，我一定会庆祝他们的那样正确的，但是这对我来说是什么在起作用？

用户相同的HTML（AS-以上）
设置的LADDA EVENT（见初始化功能在的PageController）
设置呼吁每个DOM元素按钮（见的PageController的btnNext功能）

页面控制器：
我要去刚刚粘贴整个控制器。 Ladda似乎并不了解jQuery对象。所以，我必须走这条路。

var PageController = (function ($, Ladda) { 

      function PageController(options) { 
       var that = this, 
        empty = {}, 
        dictionary = { 
         elements: { form: null, btnNext: null }, 
         selectors: { form: 'form', btnNext: '.btn-next'} 
        }; 

       var initialize = function (options) { 
        that.settings = $.extend(empty, $.isPlainObject(options) ? options : empty); 

        // Elements 
        dictionary.elements.form = $(dictionary.selectors.form); 
        dictionary.elements.btnNext = $(dictionary.selectors.btnNext, dictionary.elements.form); 

        // Events 
        dictionary.elements.btnNext.on('click', that.on.click.btnNext); 

        Ladda.bind(dictionary.elements.btnNext); 
       }; 

       this.settings = null; 
       this.on = { 
        click: { 
         btnNext: function (e) { 

          // Notice I had to point to the actual DOM ELEMENT for each button  
          var action = that.settings.actions.next; 
          var topLadda = Ladda.create(dictionary.elements.btnNext[0]); 
          var bottomLadda = Ladda.create(dictionary.elements.btnNext[1]); 
          topLadda.start(); 
          bottomLadda.start(); 

          dictionary.elements.form.attr('action', action); 
          dictionary.elements.form.submit(); 
         } 
        } 
       }; 

       initialize(options); 
      } 

      return PageController; 
     })(jQuery, Ladda);

来源

2017-08-03 20:57:49

如何保持不同步

回答

相关问题