我正在使用woocommerce和插件来满足德国市场的需求。 我使用一个实现交付时间的插件。 但只是在正常的黑色。我实际工作2个交货时间,1 - 3和5 - 10天。如果交货时间为1至3天,则应以绿色显示,如果交货时间为5 - 10天,我希望以橙色显示。
我已经将它显示为在静态页面上更改显示的颜色(没有颜色等变体的产品)。 完整的css类称为" wc-gzd-additional-info delivery-time-info"
我在页脚中添加了一些java:
<script type='text/javascript'>
var elementsa = document.getElementsByClassName("delivery-time-info")[0];
var elementsb = elementsa.innerHTML;
var elementsc = elementsa.innerHTML;
if (elementsb == "Lieferzeit: 1 - 3 Tage")
{
elementsa.innerHTML = "<span style='color:green;font-weight:bold;'>"+elementsb+"</span>";
}
if (elementsc == "Lieferzeit: 5 - 10 Tage")
{
elementsa.innerHTML = "<span style='color:orange;font-weight:bold;'>"+elementsc+"</span>";
}
</script>
&#13;
代码中的结果例如是:
<p class="wc-gzd-additional-info delivery-time-info"><span style="color:orange;font-weight:bold;">Lieferzeit: 5 - 10 Tage</span></p>
&#13;
但我的问题是对产品页面进行这些更改,例如颜色等变体。
问题是该行
<p class="wc-gzd-additional-info delivery-time-info">
&#13;
如果您没有选择颜色,则不会显示
。 在您做出决定之后,该行更改/将css类元素添加到:
<p class="wc-gzd-additional-info delivery-time-info variation_modified" style="display: block;">Lieferzeit: 1 - 3 Tage</p>
&#13;
我尝试过各种改变 document.getElementsByClassName(&#34;递送时间信息&#34) 至 document.getElementsByClassName(&#34; delivery-time-info&#34; +&#34;&#34; + variation_modified&#34;)
和其他变化。
但我认为问题是代码在页面加载后会发生变化吗?
任何提示如何制作?有什么样的重新扫描页面?
致以最诚挚的问候,非常感谢!
第一次回答后编辑,评论时间过长: 方法是帖子我认为,只是再次手动扫描代码,这就是变化按钮背后的内容......好像所有东西都已加载......
<form class="variations_form cart" method="post" enctype="multipart/form-data" data-product_id="658" data-product_variations="[{"variation_id":662,"variation_is_visible":true,"variation_is_active":true,"is_purchasable":true,"display_price":37.37,"display_regular_price":37.37,"attributes":{"attribute_farbe":"Pink"},"image_src":"","image_link":"","image_title":"","image_alt":"","price_html":"<span class=\"price\"><span class=\"amount\">37,37 €<\/span><\/span>","availability_html":"","sku":"440072","weight":" kg","dimensions":"","min_qty":1,"max_qty":"","backorders_allowed":false,"is_in_stock":true,"is_downloadable":false,"is_virtual":false,"is_sold_individually":"no","variation_description":"","delivery_time":"Lieferzeit: 1 - 3 Tage","unit_price":"","product_units":"","tax_info":"inkl. 19% MwSt."},{"variation_id":663,"variation_is_visible":true,"variation_is_active":true,"is_purchasable":true,"display_price":37.37,"display_regular_price":37.37,"attributes":{"attribute_farbe":"Gelb"},"image_src":"","image_link":"","image_title":"","image_alt":"","price_html":"<span class=\"price\"><span class=\"amount\">37,37 €<\/span><\/span>","availability_html":"","sku":"440074","weight":" kg","dimensions":"","min_qty":1,"max_qty":"","backorders_allowed":false,"is_in_stock":true,"is_downloadable":false,"is_virtual":false,"is_sold_individually":"no","variation_description":"","delivery_time":"Lieferzeit: 1 - 3 Tage","unit_price":"","product_units":"","tax_info":"inkl. 19% MwSt."},{"variation_id":664,"variation_is_visible":true,"variation_is_active":true,"is_purchasable":true,"display_price":45.16,"display_regular_price":45.16,"attributes":{"attribute_farbe":"Blau"},"image_src":"","image_link":"","image_title":"","image_alt":"","price_html":"<span class=\"price\"><span class=\"amount\">45,16 €<\/span><\/span>","availability_html":"","sku":"440073","weight":" kg","dimensions":"","min_qty":1,"max_qty":"","backorders_allowed":false,"is_in_stock":true,"is_downloadable":false,"is_virtual":false,"is_sold_individually":"no","variation_description":"","delivery_time":"Lieferzeit: 1 - 3 Tage","unit_price":"","product_units":"","tax_info":"inkl. 19% MwSt."}]">
<table class="variations" cellspacing="0">
<tbody>
<tr>
<td class="product_label"><label for="farbe">Farbe</label></td>
<td class="product_value">
<div class="select2-container kad-select select2-dropdown-open select2-container-active" id="s2id_farbe"><a href="javascript:void(0)" class="select2-choice" tabindex="-1"> <span class="select2-chosen" id="select2-chosen-2">Pink</span><abbr class="select2-search-choice-close"></abbr> <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen2" class="select2-offscreen">Farbe</label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-2" id="s2id_autogen2" disabled=""></div><select id="farbe" class="kad-select select2-offscreen" name="attribute_farbe" data-attribute_name="attribute_farbe" title="Farbe" tabindex="-1"><option value="">Wählen Sie eine Ausführung</option><option value="Pink" class="attached enabled">Pink</option><option value="Gelb" class="attached enabled">Gelb</option><option value="Blau" class="attached enabled">Blau</option></select><a class="reset_variations" href="#" style="visibility: visible; display: inline;">Lösche Auswahl</a> </td>
</tr>
</tbody>
</table>
<div class="single_variation_wrap_kad" style="display:block;">
<div class="single_variation headerfont"><span class="price" style="display: none;"><span class="amount">37,37 €</span></span></div> <div class="variations_button" style="">
<div class="quantity buttons_added"><input type="button" value="-" class="minus"><input type="number" step="1" name="quantity" value="1" title="Menge" class="input-text qty text" size="4" min="1"><input type="button" value="+" class="plus"></div>
<button type="submit" class="kad_add_to_cart headerfont kad-btn kad-btn-primary single_add_to_cart_button">In den Warenkorb</button>
<input type="hidden" name="add-to-cart" value="658">
<input type="hidden" name="product_id" value="658">
<input type="hidden" name="variation_id" class="variation_id" value="662">
</div>
</div>
这是一个.js文件,询问变体的特定产品信息:
/*!
* Variations Plugin
*/
;(function ( $, window, document, undefined ) {
$.fn.wc_gzd_variation_form = function () {
$.fn.wc_gzd_variation_form.reset_variation = function() {
if ( $('.type-product').find('.org_price').length > 0 ) {
$( '.type-product .price.variation_modified:not(.price-unit)' ).html( $('.type-product').find('.org_price').html() ).removeClass('variation_modified').show();
}
if ( $('.type-product').find('.org_delivery_time').length > 0 ) {
$( '.type-product .delivery-time-info' ).html( $('.type-product').find('.org_delivery_time').html() ).removeClass('variation_modified').show();
}
if ( $('.type-product').find('.org_unit_price').length > 0 ) {
$( '.type-product .unit-price' ).html( $('.product').find('.org_unit_price').html() ).removeClass('variation_modified').show();
}
if ( $('.type-product').find('.org_tax_info').length > 0 ) {
$( '.type-product .tax-info' ).html( $('.product').find('.org_tax_info').html() ).removeClass('variation_modified').show();
}
if ( $('.type-product').find('.org_product_units').length > 0 ) {
$( '.type-product .product-units' ).html( $('.product').find('.org_product_units').html() ).removeClass('variation_modified').show();
}
$('.org_product_info').remove();
$('.variation_modified').remove();
}
$form = this
$wrapper = $form.parents( '.type-product' )
.on( 'found_variation', function( event, variation ) {
if ( ! $wrapper.find( '.price:first' ).hasClass( 'variation_modified' ) ) {
$wrapper.append( '<div class="org_price org_product_info">' + $wrapper.find( '.price:not(.price-unit):first' ).html() + '</div>' );
if ( $wrapper.find( '.delivery-time-info:first' ).length > 0 )
$wrapper.append( '<div class="org_delivery_time org_product_info">' + $wrapper.find( '.delivery-time-info:first' ).html() + '</div>' );
if ( $wrapper.find( '.tax-info:first' ).length > 0 )
$wrapper.append( '<div class="org_tax_info org_product_info">' + $wrapper.find( '.tax-info:first' ).html() + '</div>' );
if ( $wrapper.find( '.price-unit:first' ).length > 0 )
$wrapper.append( '<div class="org_unit_price org_product_info">' + $wrapper.find( '.price-unit:first' ).html() + '</div>' );
if ( $wrapper.find( '.product-units:first' ).length > 0 )
$wrapper.append( '<div class="org_product_units org_product_info">' + $wrapper.find( '.product-units:first' ).html() + '</div>' );
$( '.org_product_info' ).hide();
}
if ( variation.price_html != '' ) {
$( '.single_variation .price' ).hide();
$wrapper.find( '.price:not(.price-unit):first' ).html( variation.price_html ).addClass( 'variation_modified' );
}
$wrapper.find( '.delivery-time-info:first' ).hide();
$wrapper.find( '.price-unit:first' ).hide();
$wrapper.find( '.tax-info:first' ).hide();
$wrapper.find( '.product-units:first' ).hide();
if ( variation.delivery_time != '' )
$wrapper.find( 'p.delivery-time-info:first' ).html( variation.delivery_time ).addClass('variation_modified').show();
if ( variation.tax_info != '' )
$wrapper.find( '.tax-info:first' ).html( variation.tax_info ).addClass('variation_modified').show();
if ( variation.unit_price != '' ) {
$wrapper.find( '.price-unit:first' ).remove();
$wrapper.find( 'div[itemprop="offers"]:first' ).after('<p class="price price-unit smaller variation_modified">' + variation.unit_price + '</p>').show();
}
if ( variation.product_units != '' ) {
$wrapper.find( '.product-units:first' ).remove();
$wrapper.find( '.product_meta' ).prepend('<span class="product-units-wrapper product-units variation_modified">' + variation.product_units + '</span>').show();
}
})
// Check variations
.on( 'update_variation_values', function( event, matching_variations ) {
setTimeout(function() {
if ( ! $('.single_variation_wrap').is(':visible') ) {
$.fn.wc_gzd_variation_form.reset_variation();
}
}, 250);
})
.on( 'click', '.reset_variations', function( event ) {
$.fn.wc_gzd_variation_form.reset_variation();
});
};
$( function() {
// wc_add_to_cart_variation_params is required to continue, ensure the object exists
if ( typeof wc_add_to_cart_variation_params === 'undefined' )
return false;
$( '.variations_form' ).wc_gzd_variation_form();
$( '.variations_form .variations select' ).change();
$( '.variations_form .variations input:radio:checked' ).change();
});
})( jQuery, window, document );
&#13;
我实际上不能编辑变体,因为我在上面尝试的方法必须在每次&#34;选择变体后重新扫描&#34;。
答案 0 :(得分:0)
[解决]
好的,这样更容易......
只需转到wp_terms查找右侧行并将名称从“1 - 3 Tage”更改为
<span style='color:green;font-weight:bold;'>1 - 3 Tage</span>
我试图在wp后端输入它,没有用。
但是通过phpmyadmin输入它。
感谢大家和最诚挚的问候!