Question

我正在动态创建jQuery中的按钮。我需要添加数据属性：

所以我在这里看到了答案：Dynamically create buttons with Jquery

$(document).ready(function() {
  for(i = 1; i <=10; i++) {
     $('<button/>', {
        text: i, //set text 1 to 10
        id: 'btn_'+i,
        click: function () { alert('hi'); }
    });
  }
});

我正在添加如下数据属性：

$(document).ready(function() {
  for(i = 1; i <=10; i++) {

   $('<button/>', {
        text: i, //set text 1 to 10
        id: 'btn_'+i,
        click: function () { alert('hi'); }
    }).attr('data-test', 1).attr('data-test2', 2);

  }
});

我在想，如果我可以做一些类似于我们添加text和id属性的方式

Answer 1

你可以这样做，但由于密钥包含-，你需要将密钥作为字符串文字传递，如

＆＃13;

$(document).ready(function() {
  for (i = 1; i <= 10; i++) {

    $('<button/>', {
      text: i, //set text 1 to 10
      id: 'btn_' + i,
      click: function() {
        alert('hi: ' + $(this).attr('data-test'));
      },
      'data-test': 1
    }).appendTo('body');

  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

＆＃13;

将数据属性添加到动态创建的按钮jQuery

1 个答案: