javascript - 如何为 Woocommerce 中的变体选项强制设置 "selected"属性?

标签 javascript php jquery wordpress woocommerce

我正在为我的一位客户开发 Woocommerce 主题。 对于这个项目,我需要克隆购物车表单(在产品页面上)以便将其显示在页面上的另一个地方。 我设法用这段代码做到了这一点:

$(document).on( 'found_variation', 'form.cart', function( event, variation ) { // found_variation // woocommerce_variation_select_change
    $('.fixed-price-right').empty();
    $(this).clone().appendTo( '.fixed-price-right' ).each(function() {
        $('.product-fixi').scrollToFixed();             
    });     
});

首先,在每次变化时,我都会清空显示表单克隆的 div。 然后,我克隆它并修复了容器 div。

问题是除了选定的变化值,我得到了所有东西。 实际上,默认选择值有这个属性:selected="selected"。但此属性不适用于其他选项。 你可以在这里看到一个活生生的例子:http://www.pro4mance.com.au/product/produrance-energy-gels-2/

如果我从克隆的表单提交,产品会被添加但没有选项。

奇怪的是,如果我在克隆表单的正确选项中手动(从 Web 控制台)添加此属性,然后将产品添加到购物车,则该产品会添加所有好的选项。

我真的不知道如何在每次更改时强制添加 selected="selected"。有人可以帮我管理吗?

谢谢大家!

最佳答案

对于需要在 Woocommerce 选项变量上强制添加“selected”属性的每个人,我是这样做的(使用 jQuery):

$('form.cart').on( 'change', '.variations select', function( event ) {
    $val=$(this).val();
    $(this).children('option').each(function(){
        $childVal = $(this).val(); 
        if ( $childVal == $val ) {
            $(this).attr('selected', 'selected');
        } else {
            $(this).removeAttr('selected');
        }   
    });
});

随时改进它(这可能不是最好的方法)。

关于javascript - 如何为 Woocommerce 中的变体选项强制设置 "selected"属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31121668/

相关文章:

javascript - 如何让我的倒计时器在每次刷新 JavaScript 时停止重新开始

javascript - 如何用javascript正确替换斜杠和撇号

php - 服务器上传后整个 WordPress 主题重置为默认值

php - 我可以在 Linux Cron Job/Crontab 上运行 Laravel Route 吗?

php - 为动态复选框添加鼠标悬停效果

c# - 如何将 csharp 绑定(bind)变量传递给 Javascript 函数

javascript - jquery获取父元素的方法

jquery - 如何使用 Jquery 获取 HTML 标签的完整定义?

javascript - 图片映射和 jQuery .show() + .hide()

jquery - 动画提交按钮的值变化