隱藏格是空當，並添加類到另一個DIV

-1

兩個類都有寬度：50％和inline-block的。

我想編寫一個腳本，它可以在沒有銷售價格的情況下改變樣式（將寬度增加100％並更改字體樣式）爲價格。

這是我到目前爲止所嘗試的。

這是第一個代碼：

jQuery(document).ready(function($) { 
if($('.eg-top-ponudbe-content-element-28').html().trim().length === 0) { 
    $('.eg-top-ponudbe-content-element-28').hide(); 
    $('.eg-top-ponudbe-content-element-24').addClass('change_regular_price'); 
} 
});

這是第二代碼：

jQuery(document).ready(function($) { 
if($('.eg-top-ponudbe-content-element-28').is(':empty')) { 
    $('.eg-top-ponudbe-content-element-28').hide(); 
    $('.eg-top-ponudbe-content-element-24').addClass('change_regular_price'); 
} 
});

而且還因爲是隱藏在所有產品的銷售價格（也與產品銷售價格）不工作

HTML是：

<div class="price_div"> 
<div class="esg-content eg-post-903 eg-top-ponudbe-content-element-28-a"> 
    <a class="eg-top-ponudbe-content-element-28 eg-post-903" href="javascript:void(0);" target="_self">regular_price 1.200 €</a></div> 

<div class="esg-content eg-post-903 eg-top-ponudbe-content-element-24-a"> 
    <a class="eg-top-ponudbe-content-element-24 eg-post-903" href="javascript:void(0);" target="_self">sale_price 1.100 €</a></div> 

    </div> 
</div>

來源

2017-09-06 alench

聽起來像您需要使用DOM遍歷來查找'.sale_price'相關的'.regular_price'。我們可以告訴你如何做到這一點，但我們需要看到你的HTML。請問您可以編輯您的問題以包含它 –

這裏它取決於.sale_price的結構，如果某個HTML標籤中的價格使用find（），那麼檢查該值是否僅包含該類中沒有任何標籤的文本，然後使用文本（），並檢查它與文本=='' – Osama

張貼一些jsfiddle（或其他）至少 – yvoytovych

您必須遍歷每個price_div，然後找到裏面的常規和銷售對，然後您可以獨立於其他價格div更新它們。東西線：

$(".price_div").each(function(_ix, el) { 
    var $priceDiv = $(el): 
    var $regularPrice = $priceDiv.find(".eg-top-ponudbe-content-element-28"); 
    var $salePrice = $priceDiv.find(".eg-top-ponudbe-content-element-24"); 

    if($regularPrice.is(':empty')) { 
    $regularPrice.hide(); 
    $salePrice.addClass('change_regular_price'); 
    } 
})

來源

2017-09-06 09:10:46 user2520818

您可以使用jQuery使用$來選擇空SALE_PRICE項目（ 'SALE_PRICE：空。'）加入一個。每（）

$('.sale_price:empty').each(function() { 
 
    $(this).hide(); 
 
    $(this).parent().find('.regular_price').addClass('change_regular_price'); 
 
})

.sale_price { 
 
    width: 50%; 
 
    background: red; 
 
    float: left; 
 
} 
 

 
.regular_price { 
 
    width: 50%; 
 
    background: blue; 
 
    float: left; 
 
} 
 

 
.regular_price.change_regular_price { 
 
    width: 100%; 
 
    background: green; 
 
    float: left; 
 
} 
 

 
ul { 
 
    list-style: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li> 
 
    <div class='sale_price'> 
 
     $5.00 
 
    </div> 
 
    <div class='regular_price'> 
 
     $7.00 
 
    </div> 
 
    </li> 
 
    <li> 
 
    <div class='sale_price'></div> 
 
    <div class='regular_price'> 
 
     $8.00 
 
    </div> 
 
    </li> 
 
    <li> 
 
    <div class='sale_price'> 
 
     $15.00 
 
    </div> 
 
    <div class='regular_price'> 
 
     $17.00 
 
    </div> 
 
    </li> 
 
</ul>

，然後遍歷結果

來源

2017-09-06 09:17:02 aikepah

謝謝，它的工作原理，只有類不會增加到正常價格：/ – alench

jQuery(document).ready(function($) { 
 
    $(".price_div").each(function() { 
 
    var regular_price = $(this).find('div:first-child'); 
 
    var sale_price = $(this).find('div:last-child'); 
 
    if(sale_price.find('a').html().trim().length === 0) { 
 
     sale_price.hide(); 
 
     regular_price.addClass('change_regular_price'); 
 
    } 
 
    }); 
 
});

.price_div { 
 
      margin-bottom: 20px; 
 
      width: 600px; 
 
      height: 40px; 
 
      border: 1px solid #ccc; 
 
     } 
 
     .price_div div { 
 
      display: inline-block; 
 
      width: 50%; 
 
      height: 40px; 
 
      line-height: 40px; 
 
      float: left; 
 
      text-align: center; 
 
     } 
 
     .change_regular_price { 
 
      width: 100% !important; 
 
     }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<div class="price_div"> 
 
    <div class="esg-content eg-post-903 eg-top-ponudbe-content-element-28-a"> 
 
    <a class="eg-top-ponudbe-content-element-28 eg-post-903" href="javascript:void(0);" target="_self">regular_price 1.200 €</a> 
 
    </div> 
 
    <div class="esg-content eg-post-903 eg-top-ponudbe-content-element-24-a"> 
 
    <a class="eg-top-ponudbe-content-element-24 eg-post-903" href="javascript:void(0);" target="_self">sale_price 1.100 €</a> 
 
    </div> 
 
</div> 
 
<div class="price_div"> 
 
    <div class="esg-content eg-post-903 eg-top-ponudbe-content-element-28-a"> 
 
    <a class="eg-top-ponudbe-content-element-28 eg-post-903" href="javascript:void(0);" target="_self">regular_price 1.200 €</a> 
 
    </div> 
 
    <div class="esg-content eg-post-903 eg-top-ponudbe-content-element-24-a"> 
 
    <a class="eg-top-ponudbe-content-element-24 eg-post-903" href="javascript:void(0);" target="_self"></a> 
 
    </div> 
 
</div>

來源

2017-09-06 09:27:52 TuanTai

隱藏格是空當，並添加類到另一個DIV

回答

相關問題