Question

我有一张包含大量图片的文档。图片分组为“堆”，每个图像将具有相应的类“pile-x”，其中x是桩＃。因此，可能有100个图像被分组成五个堆，并且它们将具有类名称pile-1 ... pile-5。用户可以将图像从一堆拖放到另一堆中。当他们这样做时，我想删除旧的pile-x类并添加新的类。用jquery有一个快速的方法吗？一种方法是使用正则表达式来匹配$（this）.attr（'class'）。还有什么更有效的吗？

Answer 1

如果必须使用class属性，这将是您最好的方法。如果您使用的是HTML5 doc类型，则可以使用数据属性。如，

<img src="..." class="..." data-pile="5" />

然后在你的脚本中你可以这样做：

$('#the-image').data('pile'); // 5

为了设置桩，只需提供一个新值。如，

$('#the-image').data('pile', 2);
$('#the-image').data('pile'); // 2

Answer 2

您可以尝试

$(this).removeClass('pile-1')
       .removeClass('pile-2')
       .removeClass('pile-3')
       .removeClass('pile-4')
       .removeClass('pile-5')
       .addClass('pile-X');

Answer 3

在jQuery中，您必须知道要使用.removeClass()，.addClass()或.toggleClass()操作的类名称。

如果对象上没有其他类，则可以将类设置为新的类名。

el.className = "pile-" + pileNum;

但是，如果对象上有其他类，并且您想要使用类，并且您不想仅使用暴力来调用所有可能的桩类名称上的removeClass，则必须按照您的建议进行操作并解析类以删除所需的名称。顺便说一下，这并不难：

el.className = el.className.replace(/\bpile-\d+\b/gi, "") + " " + "pile-" + pileNum;

jQuery这样做的方法是不使用类名来存储这些信息，而是使用对象的数据属性。然后，当您更改桩时，您可以直接将对象上的数据属性设置为新桩号。如果这是我的代码，那可能就是我的意思。

Answer 4

来自http://api.jquery.com/removeClass/

要将所有现有类替换为另一个类，我们可以使用：

.attr（'class'，'newClass'）

所以在你的情况下应该这样做：

.attr（'class'，“pile - ”+ x）

其中x是新的桩号。另外removeClass（）将删除所有clases。如果您有一个想要保留的附加课程，可以稍后添加，例如：

.attr（'class'，“pile - ”+ x）。addClass（'fixedclass'）

Jquery：如何识别元素的类

4 个答案: