我网站中的一个部分未显示在移动设备视图中。我确实检查了 woocommerce 和 php 文件,但一切看起来都不错。我尝试使用 !important 覆盖该部分,但仍然相同。我还添加了一个针对这些元素的媒体查询,但它仍然无法正常工作。此部分与 woocommerce 集成,因此,如果有任何 woocommerce 输入,我也非常感谢。
所以,我可能在脚本中遗漏了一些东西。
jQuery('form.variations_form').on( 'show_variation',
function(event, variation){
let output_date='';
let scheduled_date_string = variation.scheduled_date;
console.log(variation.scheduled_date);
let button_text_original = 'Buy Online';
let button_text_preorder = 'Pre-Order Now';
if (!scheduled_date_string) {
output_date= '7 - 10 Business Days';
jQuery(this).find('button.button').html(button_text_original);
}else{
let current_date = new Date();
let scheduled_date_parts = scheduled_date_string.split('/');/*date format must be in d/m/Y */
let scheduled_date_year = parseInt(scheduled_date_parts[2].length<4 ? '20'+scheduled_date_parts[2]:scheduled_date_parts[2]);
let scheduled_date_month = parseInt(scheduled_date_parts[1]) - 1;
let scheduled_date_day = parseInt(scheduled_date_parts[0]);
let scheduled_date = new Date(scheduled_date_year,scheduled_date_month,scheduled_date_day);
console.log(scheduled_date);
if (current_date >= scheduled_date) {
output_date= '7 - 10 Business Days';
jQuery(this).find('button.button').html(button_text_original);
}else{
output_date = scheduled_date_string;
jQuery(this).find('button.button').html(button_text_preorder);
}
}
if (jQuery('.shipping-date-container').length) {
jQuery('.shipping-date-container').html('Estimated to leave our warehouse by: <span class="shipping-date">'+output_date+'</span>');
}else if(jQuery('body.single-product .et_pb_wc_title').length){
jQuery('body.single-product .et_pb_wc_title').after('<div class="shipping-date-container">Estimated to leave our warehouse by: <span class="shipping-date">'+output_date+'</span></div>');
}
}
);
/* Estimated Shipping Date */
.shipping-date-container{
font-weight: 500;
color: #1e1919;
font-size: 17px;
line-height: 1.6em;
margin: 10px 0;
}
span.shipping-date{
color: #a13a18;
font-weight: 600;
}
@media screen and (max-width: 980px){
.shipping-date-container span.shipping-date{
display: inline-block;
}
}
<div class="shipping-date-container">
Estimated shipping date:
<span class="shipping-date">31/07/2021</span>
</div>
答案 0 :(得分:0)
在同一文件内的某处使用 jQuery 或 $ 符号时发生冲突。我的 jQuery 脚本中的何处使用 jQuery 而不是 $。