Страница 1 из 3 1 23 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Необходимо добавить еще один DIV. И получить значение. (https://javascript.ru/forum/css-html/79016-neobkhodimo-dobavit-eshhe-odin-div-i-poluchit-znachenie.html)

svileff 07.12.2019 02:54
Необходимо добавить еще один DIV. И получить значение.
 
Открываю корзину и имею такую структуру:
<div class="t706__cartwin-products">
<div class="t706__product" data-cart-product-i="0">
<div class="t706__product-amount t-descr t-descr_sm">1 210&nbsp;р.</div>
</div>
<div class="t706__product" data-cart-product-i="1">
<div class="t706__product-amount t-descr t-descr_sm">2 110&nbsp;р.</div>
</div>
<div class="t706__product" data-cart-product-i="2">
<div class="t706__product-amount t-descr t-descr_sm">567&nbsp;р.</div>
</div>
</div>

Необходимо добавить еще один DIV. И получить значение (выделил). Поместить его в добавленный DIV c -20%

Получить примерно надо такое:

<div class="t706__product" data-cart-product-i="0">
<div class="t706__product-amount t-descr t-descr_sm">1 210&nbsp;р.</div>
<div class="t706__product-amount-sale">968&nbsp;р.</div>
</div>

Вот наработки по добавлению DIV. Но почему то не выходит. Нужна помощь.

<script>
$( document ).ready(function() {

var number = 0;
//Функция создания DIV
function createinput(){
setTimeout(function() {
var spisok = $(".t706__cartwin-products").length;
for (var x = 0; x <= spisok; x++) {
$('.t706__cartwin-products:eq('+x+')').append('<div class="t706__product-amount-sale t-descr t-descr_sm">1 210&nbsp;р.</div>');
number = $('.t706__cartwin-products:eq('+x+')').html();
};
};

//При открытии корзины запускаем функцию
$( "[href = #order] , .t706__carticon-wrapper" ).click(function() {createinput();});
</script>

laimas 07.12.2019 06:45
Зачем setTimeout?

t706__cartwin-products и надо полагать здесь 706, это ID продукта, а значит такой в корзине будет только один, зачем цикл? Этот же элемент уже имеет <div class="t706__product-amount t-descr t-descr_sm">1 210&nbsp;р.</div>, зачем же его добавлять и при этом не понятно как вы хотите получить <div class="t706__product-amount-sale">968&nbsp;р.</div>?

рони 07.12.2019 09:24
svileff,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони 07.12.2019 09:25
svileff,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
function numberWithCommas(str) {
    return (+str).toFixed(2).replace(/(\d+)(\.\d+)?/g, function (c, b, a) {
    return b.replace(/(\d)(?=(\d{3})+$)/g, "$1 ") + a
});
}

$(".t-descr_sm").each(function(i, el) {
var num = (el.textContent.replace(/[^0-9.]/g, "") || 0) * 0.8;
var txt = numberWithCommas(num);
$(el).after(`<div class="t706__product-amount-sale">${txt}&nbsp;р.</div>`)
})
});
  </script>
</head>

<body>
<div class="t706__cartwin-products">
<div class="t706__product" data-cart-product-i="0">
<div class="t706__product-amount t-descr t-descr_sm">1 210&nbsp;р.</div>
</div>
<div class="t706__product" data-cart-product-i="1">
<div class="t706__product-amount t-descr t-descr_sm">2 110&nbsp;р.</div>
</div>
<div class="t706__product" data-cart-product-i="2">
<div class="t706__product-amount t-descr t-descr_sm">567&nbsp;р.</div>
</div>
</div>
</body>
</html>

svileff 07.12.2019 23:20
У меня DIV добавился не в том месте где надо и 0.00 показывает. Видима я структуру не всю указал. Вот вся структура корзины.

<div class="t706__cartwin-products">
<div class="t706__product" data-cart-product-i="0">
<div class="t706__product-thumb">
<div class="t706__product-imgdiv" style="background-image:url(https://static.tildacdn.com/tild3632-3963-4232-b737-393335343436/903417_S.jpg);">
</div>
</div>
<div class="t706__product-title t-descr t-descr_sm">Elizavecca Milky Piggy Hell-Pore Longolongo Gronique Gold Mask Pack<div style="opacity:0.7;font-size:12px;font-weight:400;">903417</div>
</div>
<div class="t706__product-plusminus t-descr t-descr_sm">
<span class="t706__product-minus">
<img src="https://static.tildacdn.com/lib/linea/c8eecd27-9482-6c4f-7896-3eb09f6a1091/arrows_circle_minus.svg" style="width:16px;height:16px;border:0;"></span>
<span class="t706__product-quantity">3</span><span class="t706__product-plus"><img src="https://static.tildacdn.com/lib/linea/c47d1e0c-6880-dc39-ae34-521197f7fba7/arrows_circle_plus.svg" style="width:16px;height:16px;border:0;"></span>
</div>
<div class="t706__product-amount t-descr t-descr_sm">3 861&nbsp;р.</div>
<div class="t706__product-del"><img src="https://static.tildacdn.com/lib/linea/1bec3cd7-e9d1-2879-5880-19b597ef9f1a/arrows_circle_remove.svg" style="width:20px;height:20px;border:0;">
</div>
</div>

<div class="t706__product" data-cart-product-i="1">
<div class="t706__product-thumb">
<div class="t706__product-imgdiv" style="background-image:url(https://static.tildacdn.com/tild6130-6561-4633-a631-306663633061/904117_S.jpg);">
</div>
</div>
<div class="t706__product-title t-descr t-descr_sm">Elizavecca Milky Piggy Vitamin C 21% Ample Mask<div style="opacity:0.7;font-size:12px;font-weight:400;">904117</div>
</div>
<div class="t706__product-plusminus t-descr t-descr_sm"><span class="t706__product-minus"><img src="https://static.tildacdn.com/lib/linea/c8eecd27-9482-6c4f-7896-3eb09f6a1091/arrows_circle_minus.svg" style="width:16px;height:16px;border:0;"></span><span class="t706__product-quantity">1</span><span class="t706__product-plus"><img src="https://static.tildacdn.com/lib/linea/c47d1e0c-6880-dc39-ae34-521197f7fba7/arrows_circle_plus.svg" style="width:16px;height:16px;border:0;"></span>
</div>
<div class="t706__product-amount t-descr t-descr_sm">1 320&nbsp;р.</div>
<div class="t706__product-del"><img src="https://static.tildacdn.com/lib/linea/1bec3cd7-e9d1-2879-5880-19b597ef9f1a/arrows_circle_remove.svg" style="width:20px;height:20px;border:0;">
</div>
</div>
</div>


Соответственно надо скидку поставить после цены.

рони 07.12.2019 23:31
svileff,
так укажите полный селектор в строке 19

рони 07.12.2019 23:34
svileff,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
function numberWithCommas(str) {
    return (+str).toFixed(0).replace(/(\d+)(\.\d+)?/g, function (c, b, a) {
    return b.replace(/(\d)(?=(\d{3})+$)/g, "$1 ") + (a || "")
});
}

$(".t706__product-amount.t-descr.t-descr_sm").each(function(i, el) {
var num = (el.textContent.replace(/[^0-9.]/g, "") || 0) * 0.8;
var txt = numberWithCommas(num);
$(el).after(`<div class="t706__product-amount-sale">${txt}&nbsp;р.</div>`)
})
});
  </script>
</head>

<body>
<div class="t706__cartwin-products">
<div class="t706__product" data-cart-product-i="0">
<div class="t706__product-thumb">
<div class="t706__product-imgdiv" style="background-image:url(https://static.tildacdn.com/tild3632-3963-4232-b737-393335343436/903417_S.jpg);">
</div>
</div>
<div class="t706__product-title t-descr t-descr_sm">Elizavecca Milky Piggy Hell-Pore Longolongo Gronique Gold Mask Pack<div style="opacity:0.7;font-size:12px;font-weight:400;">903417</div>
</div>
<div class="t706__product-plusminus t-descr t-descr_sm">
<span class="t706__product-minus">
<img src="https://static.tildacdn.com/lib/linea/c8eecd27-9482-6c4f-7896-3eb09f6a1091/arrows_circle_minus.svg" style="width:16px;height:16px;border:0;"></span>
<span class="t706__product-quantity">3</span><span class="t706__product-plus"><img src="https://static.tildacdn.com/lib/linea/c47d1e0c-6880-dc39-ae34-521197f7fba7/arrows_circle_plus.svg" style="width:16px;height:16px;border:0;"></span>
</div>
<div class="t706__product-amount t-descr t-descr_sm">3 861&nbsp;р.</div>
<div class="t706__product-del"><img src="https://static.tildacdn.com/lib/linea/1bec3cd7-e9d1-2879-5880-19b597ef9f1a/arrows_circle_remove.svg" style="width:20px;height:20px;border:0;">
</div>
</div>

<div class="t706__product" data-cart-product-i="1">
<div class="t706__product-thumb">
<div class="t706__product-imgdiv" style="background-image:url(https://static.tildacdn.com/tild6130-6561-4633-a631-306663633061/904117_S.jpg);">
</div>
</div>
<div class="t706__product-title t-descr t-descr_sm">Elizavecca Milky Piggy Vitamin C 21% Ample Mask<div style="opacity:0.7;font-size:12px;font-weight:400;">904117</div>
</div>
<div class="t706__product-plusminus t-descr t-descr_sm"><span class="t706__product-minus"><img src="https://static.tildacdn.com/lib/linea/c8eecd27-9482-6c4f-7896-3eb09f6a1091/arrows_circle_minus.svg" style="width:16px;height:16px;border:0;"></span><span class="t706__product-quantity">1</span><span class="t706__product-plus"><img src="https://static.tildacdn.com/lib/linea/c47d1e0c-6880-dc39-ae34-521197f7fba7/arrows_circle_plus.svg" style="width:16px;height:16px;border:0;"></span>
</div>
<div class="t706__product-amount t-descr t-descr_sm">1 320&nbsp;р.</div>
<div class="t706__product-del"><img src="https://static.tildacdn.com/lib/linea/1bec3cd7-e9d1-2879-5880-19b597ef9f1a/arrows_circle_remove.svg" style="width:20px;height:20px;border:0;">
</div>
</div>
</div>
</body>
</html>

svileff 07.12.2019 23:42 
<script>
$( document ).ready(function createinput(){
function numberWithCommas(str) {
    return (+str).toFixed(3).replace(/(\d+)(\.\d+)?/g, function (c, b, a) {
    return b.replace(/(\d)(?=(\d{3})+$)/g, "$1 ") + a
});
}
$(".t706__product-amount.t-descr.t-descr_sm").each(function(i, el) {
var num = (el.textContent.replace(/[^0-9.]/g, "") || 0) * 0.8;
var txt = numberWithCommas(num);
$(el).after(`<div class="t706__product-amount-sale">${txt}&nbsp;р.</div>`)
})
});
//При открытии корзины запускаем функцию 
$( "[href = #order], .t706__carticon-wrapper").click(function() {createinput();});
</script>


Я запускаю через открытие корзины в окне. Может тут допустил ошибку...

рони 07.12.2019 23:48
svileff,
<script>
$(function() {
    $("[href = '#order'], .t706__carticon-wrapper").click(function() {
        function numberWithCommas(str) {
            return (+str).toFixed(0).replace(/(\d+)(\.\d+)?/g, function(c, b, a) {
                return b.replace(/(\d)(?=(\d{3})+$)/g, "$1 ") + (a || "")
            })
        }
        $(".t706__product-amount.t-descr.t-descr_sm").each(function(i, el) {
            var num = (el.textContent.replace(/[^0-9.]/g, "") || 0) * .8;
            var txt = numberWithCommas(num);
            $(el).after('<div class="t706__product-amount-sale">' + txt + "&nbsp;\u0440.</div>")
        })
    })
});
  </script>

svileff 07.12.2019 23:54
Странно сделал как написали вообще все пропало
https://lowo.store/all


Часовой пояс GMT +3, время: 14:59.
Страница 1 из 3 1 23 >
Показывать 40 сообщений этой темы на одной странице