Проверка каждой позиции заголовка корзины на предмет спецификаций c - PullRequest
Новая
       8

Проверка каждой позиции заголовка корзины на предмет спецификаций c

0 голосов
/ 10 апреля 2020

Я нахожусь в процессе разработки теста AB для страницы корзины электронной торговли. У нас есть список из примерно 100 стиленов, которые мы не собираемся принимать.

У нас есть сообщения, отображаемые на страницах отображения этих конкретных стилей, но мы также хотели бы усилить это сообщение на странице корзины, если какой-либо продукт в корзине соответствует списку названий стилей, которые соответствуют требованиям.

Я начал с создания переменной массива всех подходящих имен стилей (здесь сокращенно, например). Затем я просматриваю каждый тег заголовка элемента корзины и проверяю .text () этого элемента. Если .text () соответствует одному из стилей, которые я ищу, тогда я бы хотел go вперед и добавить сообщение под тегом заголовка элемента корзины.

Вот сценарий, который я написал, тем не менее, я не вижу ожидаемого результата при локальном запуске этого кода в моем фрагменте devtools: 

var styleList = ['Astawia Loafer','Another Style','So On','So Forth'];
var finalSaleMessage = '<span><strong>Final sale! </strong>No returns on our best deals.</span>'

function checkStyleName(value,arr){
    var result = false;

    for (var i = 0; i < arr.length; i++){
        var name = arr[i];
        if(name == value){
            result = true;
            break;
        }
    }
    return result;
}

$('.crt-heading--item').each(function(){
    if (checkStyleName($('.crt-heading--item').text(),styleList) == true) {
        // append the message
    }
    
})

Любой вклад со стороны сообщества будет принята с благодарностью. Пожалуйста, дайте мне знать, если вам понадобится дополнительная информация.

Спасибо!

Ответы [ 2 ]

1 голос
/ 10 апреля 2020

Можно немного упростить. Не нужно отправлять массив каждый раз.
Использование include.
Похоже, текст в формате BRAND PRODUCT_NAME CATEGORY. Вы можете разделить или сделать что-то, чтобы получить PRODUCT_NAME.
Использование this, как указано devmiguelopz

    var styleList = ['Astawia Loafer','Another Style','So On','So Forth'];
    var finalSaleMessage = '<span><strong>Final sale! </strong>No returns on our best deals.</span>'
   
    // OLD SUGGESTION
    /*
        $('.crt-heading--item').each(function(){
        if (styleList.includes($(this).text()) {
            // append the message
        }
*/
    // This will iterate on the elements
    $('.crt-heading--item').each(function(){
        // Iterate on the styleList
        var styleListLength = styleList.length;
        for(var i = 0, i < styleListLength; i++){
           // Check if the name has entry from styleList
           if($(this).text().includes(styleList[i])){
              // DO STUFF
           }
        }
    
})
// We re running a loop inside a loop in this case.
// There may be better ways of doing this with .some/.filter/.map

Узнайте, что может .includes сделать для вас: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

1 голос
/ 10 апреля 2020

Проблема в том, что вы go просматриваете все элементы определенного класса и не ссылаетесь на каждый из них. 

var styleList = ['Astawia Loafer','Another Style','So On','So Forth'];
var finalSaleMessage = '<span><strong>Final sale! </strong>No returns on our best deals.</span>'

function checkStyleName(value,arr){
    var result = false;

    for (var i = 0; i < arr.length; i++){
        var name = arr[i];
        if(name == value){
            result = true;
            break;
        }
    }
    return result;
}
$('.crt-heading--item').each(function(){
    if (checkStyleName($(this).text(),styleList) == true) {
        // append the message
        //test
        alert($(this).text())
    }
    
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li class= "crt-heading--item">Astawia Loafer</li>
  <li class= "crt-heading--item">Astawia Loafer</li>
  <li class= "crt-heading--item">3</li>
  <li class= "crt-heading--item">So On</li>
  <li class= "crt-heading--item">5</li>
</ul>
...