Woocommerce:如何在产品附加组件上添加提醒或上限?

时间:2014-09-16 14:06:45

标签: jquery wordpress woocommerce

使用Woocommerce的产品附加插件销售可配置产品,我很难理解如何限制每个产品的附加组件数量。对于当前设置,每个加载项不会有最小值或最大值,但可以选择的总加载项上有最大值。我正在使用可变产品设置,每个变体都有自己的上限。有关如何应用上限或在达到上限时添加警报消息的任何想法?

我正在使用以下内容生成所选的加载项总数:

$cart.find('.addon').each(function() {

            var addon_options = 0;

            if ( $(this).is('.addon-input_multiplier') ) {
                if( isNaN( $(this).val() ) || $(this).val() == "" ) { // Number inputs return blank when invalid
                    $(this).val('');
                    $(this).closest('p').find('.addon-alert').show();
                } else {
                    if( $(this).val() != "" ){
                        $(this).val( Math.ceil( $(this).val() ) );
                    }
                    $(this).closest('p').find('.addon-alert').hide();
                }
                addon_options = $(this).val();
            }
            if ( ! addon_options )
                addon_options = 0;

            options_total = parseFloat( options_total ) + parseFloat( addon_options );
        } );

请参阅:http://21expressions.com/options_total.png

上的示例

在此示例中,选择了8个加载项,即上限。如何提醒用户已达到上限?

1 个答案:

答案 0 :(得分:0)

我将带有警报消息的div添加到附加模板文件中。每个div都有一个css类,对应于每个产品变体和它自己的警报消息,当超过上限时将显示。例如.large如果选择大小。这些类设置为display:none。选择变体后,将使用以下内容添加另一个类:

$("#product-size").change(function(){
        $( "select option:selected").each(function(){
            if($(this).attr("value")=="large")  {
                $(".large").addClass('l-cap');
                $(".small").removeClass('s-cap');
                } 

            else if ($(this).attr("value")=="small"){
                $(".small").addClass('s-cap');
                $(".large").removeClass('l-cap');
            }              

        });
}).change();

使用上面的options_total(初始帖子)和添加的新类,将显示一条警告消息:

if ( options_total > 8) {
            $(".s-cap").show();
        }

        if ( options_total < 9) {
            $(".s-cap").hide();
        }

        if ( options_total > 10) {
            $(".l-cap").show();
        }

        if ( options_total < 11) {
            $(".l-cap").hide();
        }

大号的上限为10,小号的上限为8.上限允许在超出上限时显示警告消息,并在用户超过上限后减少所选的附加组件时隐藏