Question

我在表格中有一系列<td>个元素，在我的上下文中，是＆＃34; slot＆＃34;用户可以选择的空间。每个插槽都有一个属性（data-slot-stamp），用于保存插槽的ID（时间戳）。当用户点击广告位时，该时间戳会添加到其他元素的.addButton）属性data-selected-slots中。如果用户再次点击该广告位，则该广告位将从.addButton的data-selected-slots属性中删除。以下代码段正在运行，但第一次点击除非用户正在从他们的选择中删除该插槽。

所需行为的示例：

用户点击任意广告
该槽的data-slot-stamp属性的值被添加到.addButton元素的data-chosen-slots属性的值
如果用户再次点击同一个插槽，则应该从.addButton元素的data-chosen-slots属性的值中删除该插槽的data-slot-stamp属性的值。

在我的案例中发生了什么：

用户点击任意广告
该槽的data-slot-stamp属性的值被添加到.addButton元素的data-chosen-slots属性的值
如果用户再次点击同一个广告位（但仅限于自页面刷新后点击的第一个广告位），该广告位的数据广告位图章属性的值不会被删除，而是保留在该值中data-chosen-slots属性。
在随后点击任何广告位时，该功能按预期工作，但最初点击的广告位数据永远不会被删除。

Html结构：

<table class="spacesTable">
          <tr>
                <td class="slot used unselected" data-slot-stamp="123456789">
                Slot 1
                </td>
                <td class="slot used unselected" data-slot-stamp="987654321">
                Slot 2
                </td>
                <td class="slot used unselected" data-slot-stamp="654321987">
                Slot 3
                </td>
                <td>
                     <div class="addButton" data-selected-slots="">
                     Add Button
                     </div>
                </td>
          </tr>
     </table>

相关的jQuery：

    $('.spacesTable').on('click', '.slot.used', function() {
        var curAtts = $(this).siblings('.addButton').attr('data-selected-slots');
        var clickedStamp = $(this).attr('data-slot-stamp');

        if ($(this).hasClass('unselected')) {
$(this).addClass('selected').removeClass('unselected');
            //Add to the values stored in the data-selected-slots attr of the button for this row
            var spacer = ',';
            if (!curAtts) {
                curAtts = '';
                spacer = '';
            }
            $(this).siblings('.addButton').attr('data-selected-slots', clickedStamp+spacer+curAtts);

        } else if ($(this).hasClass('selected')) {
$(this).removeClass('selected').addClass('unselected');
            //check to see if the slot timestamp is in the button's data-selected-slots attr, and if so, remove it
            var findStamp = curAtts.indexOf(clickedStamp);
            if (findStamp != -1) {
                curAtts = curAtts.replace(clickedStamp+',','');
                $(this).siblings('.addButton').attr('data-selected-slots', curAtts);
            }

        }
     });

Answer 1

因为＆＃34;，＆＃34;

改变这个：

curAtts = curAtts.replace(clickedStamp+',','');

有类似的东西：

if (curAtts.indexof(",") > 0) {
    curAtts = curAtts.replace(clickedStamp+',','');
}else{
    curAtts = curAtts.replace(clickedStamp,'');
}

希望有所帮助

点击功能的一部分在第一次点击时不起作用

1 个答案: