0

我尝试使用 PHP 和 Javascript 制作一些可重复的字段。这工作正常,但在保存帖子(为 WordPress 创建插件)后,克隆的行将覆盖最新的行。这是因为我没有为每一行使用唯一的 id。

我想用 javascript 添加一个 'id' 属性,并且我希望使用 id 1 增加创建的每一行。我已经用 PHP 做过类似的事情,但发现这不是我想要的,我认为我最好用 javascript,因为当我使用“添加新”按钮克隆字段时,数量不会增加+1;

这是我使用过的 php 代码:

$count = 2;
for ($i = 0; $i < $count; $i++) {

    // Begin a table row
    echo '<tr class="row" id="' . '['.$i.']' . '-repeatable">';
    echo '<td class="order">' . '['.$i.']' . '</td>';

            // Do cool stuff inside the row

    echo '<td class="remove"><a class="repeatable-remove button" href="#">-</a></td>';
    echo '</tr>'; // End .row

} // End for loop

<a href"#" class="button">Add new row</a>

可重复字段的 JS 代码:

// Add repeatable row
jQuery('.repeatable-add').click(function() {
    // Clone row
    var row = jQuery(this).closest('.ui-sortable').find('tbody tr.row:last-child');
    var clone = row.clone();

    clone.find('input[type=text], text, textarea, select, input.upload_image').val(''); // Reset the values
    clone.find('.preview_image').attr('src', ''); // Reset the values

    row.after(clone);

    //
    return false;
});

我想我必须做这样的事情:

clone.find('tr.row').attr('id', 'repeatable-' + addInteger);

但是如何在 Jquery/Javascript 中增加 +1,就像我在 PHP 中的示例一样?

4

1 回答 1

1

您要做的是查看您正在克隆的行的 ID,并使用该 ID 为新行提供正确的索引值。我在您的示例中添加了两行代码,一行定义了一个名为的新变量clonedIdIndex,另一行使用该变量中的值为克隆行定义了一个新 ID。

jQuery('.repeatable-add').click(function() {
    // Clone row
    var row = jQuery(this).closest('.ui-sortable').find('tbody tr.row:last-child'),
        clone = row.clone(),
        clonedIdIndex = parseInt( clone.find('tr.row').attr('id').split('-')[1], 10 );

    clone.find('input[type=text], text, textarea, select, input.upload_image').val('');    
    clone.find('.preview_image').attr('src', ''); // Reset the values

    // Assign new ID
    clone.find('tr.row').attr('id', 'repeatable-' + (++clonedIdIndex));

    row.after(clone);

    //
    return false;
});
于 2013-01-20T16:18:23.333 回答