为WooCommerce变体选择器option添加stock-status布尔自定义属性
WooCommerce变体下拉选项添加库存自定义属性实现
你原来的思路方向是对的,不需要靠匹配返回文本判断库存状态——这种写法后续如果修改库存显示文案就会失效,最优方案是调整原有库存查询函数,一次遍历同时拿到需要的显示文本和库存布尔值,直接插入到option属性中,没有重复查询性能更高,也不会因为文案调整出问题。
调整后可直接使用的代码
// 同时返回库存状态显示文本、库存布尔值,一次查询复用两个结果 function get_variation_stock_data( $product, $name, $term_slug ){ $in_stock = false; foreach ( $product->get_available_variations() as $variation ){ if($variation['attributes'][$name] == $term_slug ) { $in_stock = (bool)$variation['is_in_stock']; break; } } $status_text = $in_stock ? ' - (In Stock)' : ' - (Out of Stock)'; return [ 'text' => $status_text, 'in_stock' => $in_stock ? 'true' : 'false' ]; } add_filter( 'woocommerce_dropdown_variation_attribute_options_html', 'show_stock_status_in_dropdown', 10, 2); function show_stock_status_in_dropdown( $html, $args ) { // 仅针对单变体属性的商品下拉生效 if( sizeof($args['product']->get_variation_attributes()) == 1 ) : $options = $args['options']; $product = $args['product']; $attribute = $args['attribute']; $name = $args['name'] ? $args['name'] : 'attribute_' . sanitize_title( $attribute ); $id = $args['id'] ? $args['id'] : sanitize_title( $attribute ); $class = $args['class']; $show_option_none = $args['show_option_none'] ? true : false; $show_option_none_text = $args['show_option_none'] ? $args['show_option_none'] : __( 'Choose an option', 'woocommerce' ); if ( empty( $options ) && ! empty( $product ) && ! empty( $attribute ) ) { $attributes = $product->get_variation_attributes(); $options = $attributes[ $attribute ]; } $html = '<select id="' . esc_attr( $id ) . '" class="' . esc_attr( $class ) . '" name="' . esc_attr( $name ) . '" data-attribute_name="attribute_' . esc_attr( sanitize_title( $attribute ) ) . '" data-show_option_none="' . ( $show_option_none ? 'yes' : 'no' ) . '">'; $html .= '<option value="">' . esc_html( $show_option_none_text ) . '</option>'; if ( ! empty( $options ) ) { if ( $product && taxonomy_exists( $attribute ) ) { $terms = wc_get_product_terms( $product->get_id(), $attribute, array( 'fields' => 'all' ) ); foreach ( $terms as $term ) { if ( in_array( $term->slug, $options ) ) { // 一次获取库存文本和状态值 $stock_data = get_variation_stock_data( $product, $name, $term->slug ); $html .= '<option value="' . esc_attr( $term->slug ) . '" ' . selected( sanitize_title( $args['selected'] ), $term->slug, false ) . ' stock-status="' . esc_attr($stock_data['in_stock']) . '">' . esc_html( apply_filters( 'woocommerce_variation_option_name', $term->name ) . $stock_data['text'] ) . '</option>'; } } } else { foreach ( $options as $option ) { $selected = sanitize_title( $args['selected'] ) === $args['selected'] ? selected( $args['selected'], sanitize_title( $option ), false ) : selected( $args['selected'], $option, false ); // 一次获取库存文本和状态值 $stock_data = get_variation_stock_data( $product, $name, $option ); $html .= '<option value="' . esc_attr( $option ) . '" ' . $selected . ' stock-status="' . esc_attr($stock_data['in_stock']) . '">' . esc_html( apply_filters( 'woocommerce_variation_option_name', $option ) . $stock_data['text'] ) . '</option>'; } } } $html .= '</select>'; endif; return $html; }
实现说明
- 把原来只返回库存文本的函数重构为返回数组结构,一次变体遍历同时拿到显示文本和布尔状态,没有重复查询开销
- 输出option标签时直接把库存状态值插入到
stock-status自定义属性中,属性值固定为true/false,和预期输出格式完全一致 - 属性值做了转义处理,不会出现HTML注入风险
- 后续jQuery逻辑中,直接通过
$(this).find('option:selected').attr('stock-status')即可拿到对应选项的库存状态,不需要额外做计算。
内容的提问来源于stack exchange,提问作者inspirednz
相关产品推荐
相关产品推荐

