在 WooCommerce 结帐中根据运输方式隐藏特定元素
Hide specific element based on shipping method in WooCommerce checkout
我正在为 Woocommerce 添加一个代码片段,以便在选择送货方式取货时在结帐页面上隐藏 div。
// When shipping method is selected
jQuery( 'form.checkout' ).on( 'change', 'input[name^="shipping_method"]', function () {
var val = jQuery( this ).val();
if ( val.match( "^local_pickup:2" ) ) {
jQuery( '.lds_plugin' ).slideUp(); // hide shipping address
} else {
jQuery( '.lds_plugin' ).slideDown(); // show shipping address
// scroll to top of shipping address
jQuery('html, body').animate({
scrollTop: jQuery(".lds_plugin").offset().top - 120
}, 1500);
}
} );
我从这个 link 得到了这段代码:jQuery on checkout page for change of shipping method - hide show div 50% works 我通过使用 div 的 class 更改了 div 名称我想隐藏。
但是,当我尝试保存和激活此代码段时出现错误。
不要惊慌
您尝试保存的代码片段在第 3 行产生了致命错误:
语法错误,意外'var' (T_VAR)
之前版本的代码段没有变化,本站的其余部分应该是
像以前一样正常工作。
请使用浏览器中的后退按钮 return 返回上一页并尝试修复
代码错误。如果您愿意,可以关闭此页面并放弃刚刚所做的更改。不
将对此站点进行更改。
我该如何解决这个问题?
由于您在代码中设置了特定的送货方式费率 ID local_pickup:2
,而不是针对 所有本地取件送货方式,您应该替换:
if ( val.match( "^local_pickup:2" ) ) {
与:
if ( 'local_pickup:2' === val ) {
它将解决您的问题……
现在你的代码最好设置如下:
jQuery(document.body).on('change', 'input[name^="shipping_method"]', function() {
if ( 'local_pickup:2' === jQuery(this).val() ) {
jQuery('.lds_plugin').slideUp(); // hide shipping address
} else {
jQuery('.lds_plugin').slideDown(); // show shipping address
// scroll to top of shipping address
jQuery(document.body).animate({
scrollTop: jQuery('.lds_plugin').offset().top - 120
}, 1500);
}
});
或在外部 javascript 文件中,例如:
jQuery( function($){
$(document.body).on('change', 'input[name^="shipping_method"]', function() {
if ( 'local_pickup:2' === $(this).val() ) {
$('.lds_plugin').slideUp(); // hide shipping address
} else {
$('.lds_plugin').slideDown(); // show shipping address
// scroll to top of shipping address
$(document.body).animate({
scrollTop: $('.lds_plugin').offset().top - 120
}, 1500);
}
});
});
我正在为 Woocommerce 添加一个代码片段,以便在选择送货方式取货时在结帐页面上隐藏 div。
// When shipping method is selected
jQuery( 'form.checkout' ).on( 'change', 'input[name^="shipping_method"]', function () {
var val = jQuery( this ).val();
if ( val.match( "^local_pickup:2" ) ) {
jQuery( '.lds_plugin' ).slideUp(); // hide shipping address
} else {
jQuery( '.lds_plugin' ).slideDown(); // show shipping address
// scroll to top of shipping address
jQuery('html, body').animate({
scrollTop: jQuery(".lds_plugin").offset().top - 120
}, 1500);
}
} );
我从这个 link 得到了这段代码:jQuery on checkout page for change of shipping method - hide show div 50% works 我通过使用 div 的 class 更改了 div 名称我想隐藏。
但是,当我尝试保存和激活此代码段时出现错误。
不要惊慌
您尝试保存的代码片段在第 3 行产生了致命错误:
语法错误,意外'var' (T_VAR)
之前版本的代码段没有变化,本站的其余部分应该是 像以前一样正常工作。
请使用浏览器中的后退按钮 return 返回上一页并尝试修复 代码错误。如果您愿意,可以关闭此页面并放弃刚刚所做的更改。不 将对此站点进行更改。
我该如何解决这个问题?
由于您在代码中设置了特定的送货方式费率 ID local_pickup:2
,而不是针对 所有本地取件送货方式,您应该替换:
if ( val.match( "^local_pickup:2" ) ) {
与:
if ( 'local_pickup:2' === val ) {
它将解决您的问题……
现在你的代码最好设置如下:
jQuery(document.body).on('change', 'input[name^="shipping_method"]', function() {
if ( 'local_pickup:2' === jQuery(this).val() ) {
jQuery('.lds_plugin').slideUp(); // hide shipping address
} else {
jQuery('.lds_plugin').slideDown(); // show shipping address
// scroll to top of shipping address
jQuery(document.body).animate({
scrollTop: jQuery('.lds_plugin').offset().top - 120
}, 1500);
}
});
或在外部 javascript 文件中,例如:
jQuery( function($){
$(document.body).on('change', 'input[name^="shipping_method"]', function() {
if ( 'local_pickup:2' === $(this).val() ) {
$('.lds_plugin').slideUp(); // hide shipping address
} else {
$('.lds_plugin').slideDown(); // show shipping address
// scroll to top of shipping address
$(document.body).animate({
scrollTop: $('.lds_plugin').offset().top - 120
}, 1500);
}
});
});