Question

您好，我的jquery看起来像这样：

var autoStart = true;

jQuery(document).ready(function($) {

    $('.royalSlider').each(function() {

      var autoStart = true;
      var slider = $(this);
      var button = $('<button>pause</button>').insertAfter(slider).click(function() {

        if(autoStart) {
            $(this).html('play');
        } else {
            $(this).html('pause');
        }
        autoStart = !autoStart;

        slider.royalSlider('toggleAutoPlay');
      });

    });

我想为此代码中的按钮分配一些css，如何为此按钮分配一个类？感谢

Answer 1

＃1 最简单的方法是在您的按钮定义中加入class='class-name'。

＃2 第二种最简单的方法是将id='button-name'添加到定义中，然后执行：

$("#button-name").addClass("class-name")

...将按钮插入DOM后。

＃3 第三种/最难的方法是不添加class或id，并从内容开始工作。你会这样做：

$("button:contains('pause')").addClass("class-name");

＃1 绝对是最快的。没有额外的处理！就这样做：

var button = $('<button class="class-name">pause</button>') ...

为了进一步优化，请执行以下操作：

function toggleAutostart( autoStart ) {
  if ( autoStart == undefined ) autoStart = true;

  if(autoStart) {
        $(this).html('play');
  } else {
        $(this).html('pause');
  }
  autoStart = !autoStart;

  slider.royalSlider('toggleAutoPlay');
}

jQuery(document).ready(function($) {
    $('.royalSlider').each(function() {
        $('<button class="class-name">pause</button>')
            .insertAfter( $(this) )
            .click( toggleAutostart );
    );
});

Answer 2

$(this).addClass('classname');

可能你想首先检查存在... 看一下参考文献：http://api.jquery.com/addclass/

Answer 3

创建元素the jQuery way

var btn = $('<button />' , {
      text    : 'pause',
      'class' : 'myClass',
      click   : handleClick
}).insertAfter(slider);

function handleClick() {
    $(this).html(autoStart ? 'play' : 'pause');
    autoStart = !autoStart;
    slider.royalSlider('toggleAutoPlay');
}

如何将类分配给jquery按钮var

3 个答案: