Jquery .each()只对1个元素有效

Question

我想删除administrate-price类价格的最后5个字符。这只适用于一个元素，我可以在我的控制台中看到。

$(".administrate-price").each(function(i, object) {
    thePrice = $(this).text();
});
thePrice = thePrice.substr(0, thePrice.length - 5);

我怎样才能使它适用于所有的administrate-price元素呢？

Answer 1

当each迭代完成时，thePrice被设置为最后一个元素的文本。在迭代本身中执行substring操作

$(".administrate-price").each(function(i, object) {
         var thePrice = $(this).text();
         $(this).text(thePrice.substr(0, thePrice.length-5));
    });

Answer 2

你需要更好地理解你的构建块。

jQuery .each(fn)方法可用于任何jQuery集合，并使用元素的数字索引将函数fn同步应用于集合中的每个元素。

因此，您的代码如下所示：

1. 获取具有administrate-price类的所有元素。为每个元素设置
2. ：将全局变量thePrice设置为元素的内部文本。
3. 循环完成后:将全局变量thePrice设置为不包含最后5个字符的子字符串。

步骤2重复地将全局变量设置为的值，以便只保留最后一个值。就其本身而言，您给出的代码片段并没有做其他任何事情；它只是阻塞了一个全局变量，稍后您可以使用window.thePrice (在浏览器上)看到该变量。

相反，你可能想要这样：

1. 获取具有administrate-price类的所有元素。为每个元素设置
2. ：
   • 获取该文本的当前文本。
   • 将当前文本设置为上面的文本

​

因此，函数(封装步骤2)需要是：

function () { 
    var el = $(this);
    el.text( // setter
        el.text() // getter
          .slice(0, -5) // truncation
    );
}

这定义了一个局部变量el，它保存了$(this)，因此jQuery不需要构建两个单元素集合，只需重用一个作为getter和setter；如果需要，也可以只编写单行function(){$(this).text($(this).text().slice(0, -5))}，而不存储此变量。

Answer 3

请注意，在循环完成后，您将在循环外部设置thePrice值。这意味着它只能看到最终迭代的值。试试这个：

$(".administrate-price").each(function(i, object) {
    thePrice = $(this).text().substr(0, thePrice.length - 5);
    $(this).text(thePrice);
});

同样值得注意的是，在这种情况下不需要使用each()，因为您可以向text()提供一个函数，该函数将针对每个元素单独执行。试试这个：

$(".administrate-price").text(function(i, t) {
    return t.substr(0, t.length - 5);
});