javascript - 将 data-mini=true 属性附加到动态创建的元素

Question

我有以下代码:

$('<td>').append($('<input>').attr({ type: 'text', readonly: 'readonly', value: currentSet.weight }));

稍后，我将其附加并应用样式:

.trigger('create');

代码运行得很好。然而，我也试图使该输入看起来迷你，jquery-mobile 风格(即好像 <input> 附加了 data-mini="true" 属性)。我无法成功地做到这一点。我尝试过以下方法:

$('<td>').append($('<input>').data('data-mini', 'true').attr({ type: 'text', readonly: 'readonly', value: currentSet.weight }));
$('<td>').append($('<input>').attr({ type: 'text', data-mini: 'true', readonly: 'readonly', value: currentSet.weight }));

上面两行导致文件中的任何 javascript 都不会被执行。我也尝试过做类似以下的事情，其中​​ .dynamicRow是 <tr>包含 <td>我正在创建:

$('.dynamicRow').find('<input>').data('data-mini', 'true');

有什么想法吗？

Answer 1

使用 .data() 时，不应使用 data- 前缀；

试试这个；

$('<td>').append($('<input>').data('mini', true).attr({ type: 'text', readonly: 'readonly', value: currentSet.weight }));