Пересчет значения элемента при помощи jQuery

136
19 апреля 2022, 12:40

Вопрос следующий:

Есть заголовки с названием продукта. В конце названия есть некоторое число. Также у каждого продукта есть его цена. Нужно достать из каждого заголовка число в конце и обновить цену приписав к ней [число из заголовка / 1000].

Не очень понимаю как это сделать на jQuery. Ниже скинул код, который у меня получился.

Но в нем есть одна проблема: Мне удается вытащить при помощи text() только одно число из первого заголовка, а как добраться до остальных и использовать каждое последующее я не понимаю.

Я новичок в этом деле, может посоветуете что-нибудь, буду признателен.

$(document).ready(function() {
  var a = $('h1.product-title').text();
  alert(a);
  var final = +a.match(/\d+/) / 1000;
  $('div.product-price').text(function(index, text) {
    var el = text;
    return +el.match(/\d+/) + " ₽/" + final + " KG";
  });
  $('h1.product-title').text(function(index, text) {
    var x = text.replace(/[0-9]/g, '');
    return x;
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1 class=product-title> blablabla hj 500 </h1>
<h1 class=procuct-title> blablabla h 1500 </h1>
<div class="product-price">200</div>
<div class="product-price">2000</div>

Answer 1

Можно было бы ещё на одну строчку сократить ;-)

let aPrice = $('div.product-price');
$('h1.product-title').each(function(i) {
  let nTitle = +$(this).text().match(/\d+/) / 1000;
  aPrice.eq(i).text(function(j, text) {
    return +text.match(/\d+/) + " ₽/" + nTitle + " KG";
  });
  $(this).text(function(k, text) {
    return text.replace(/\d+/g, '');
  });
});
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<h1 class=product-title> blablabla hj 500 </h1>
<h1 class=product-title> blablabla h 1500 </h1>
<div class="product-price">200</div>
<div class="product-price">2000</div>

READ ALSO
Добавить input в форму при клике

Добавить input в форму при клике

Есть несколько блоков такого вида:

263
Передача параметров PHP из jquery step basic в скрипт

Передача параметров PHP из jquery step basic в скрипт

Установил базовый скрипт jquery step basic example

241
Вернуть из jquery-запроса html код с php-бека

Вернуть из jquery-запроса html код с php-бека

Есть такой кодОн отправляет запрос на бекенд, который должен вернуть просто html-код, что он и делает:

163
Не выбирается активный чекбокс

Не выбирается активный чекбокс

Вот так выглядит верстка:

219