gpt4 book ai didi

javascript - 从事件类中获取值并假设为另一个

转载 作者:行者123 更新时间:2023-11-28 08:32:14 25 4
gpt4 key购买 nike

我在开发一个适用于液体的产品配置器。Liquid 使用标签、对象和过滤器的组合来加载动态内容。

  • 每个产品都有两个配置选项。颜色和 Material 。
  • 这两个选项都显示为可点击的样本。

我们想添加效果, Material 样本将背景颜色更改为所选颜色变体的颜色。

发生在这里:http://printnil.com/products/new-standard

swatch.liquid:

{% if swatch == blank %}
{% else %}

{% assign found_option = false %}
{% assign is_color = false %}
{% assign option_index = 0 %}

{% for option in product.options %}
{% if option == swatch %}
{% assign found_option = true %}
{% assign option_index = forloop.index0 %}
<style>
#product-select-option-{{ option_index }} { display: none; }
#product-select-option-{{ option_index }} + .custom-style-select-box { display: none !important; }
</style>
<script>$(window).load(function() { $('.selector-wrapper:eq({{ option_index }})').hide(); });</script>
{% assign downcased_option = swatch | downcase %}
{% if downcased_option contains 'color' or downcased_option contains 'colour' %}
{% assign is_color = true %}
{% endif %}
{% endif %}
{% endfor %}

{% unless found_option %}
{% else %}
<div class="swatch clearfix swatch-{{swatch}}" data-option-index="{{ option_index }}">
{% assign values = '' %}
{% for variant in product.variants %}
{% assign value = variant.options[option_index] %}
{% unless values contains value %}
{% assign values = values | join: ',' %}
{% assign values = values | append: ',' | append: value %}
{% assign values = values | split: ',' %}

<div data-value="{{ value | escape }}" class="swatch-element {% if is_color %}color {% endif %}{{ value | handle }}">
{% if is_color %}
<div class="tooltip">{{ value }}</div>
{% endif %}
<input id="swatch-{{ option_index }}-{{ value | handle }}" type="radio" name="option-{{ option_index }}" value="{{ value | escape }}"{% if forloop.first %} checked{% endif %}/>
{% if is_color %}
<label for="swatch-{{ option_index }}-{{ value | handle }}" style="background-color: {{ value | split: ' ' | last | handle }};">
</label>
{% else %}
<label for="swatch-{{ option_index }}-{{ value | handle }}">
{{ value }}
</label>
{% endif %}
</div>
{% endunless %}

{% endfor %}
</div>

{% endunless %}

{% endif %}

最佳答案

<script> 
var mat = jQuery(".swatch.clearfix.swatch-Material");
var colors = jQuery(".swatch-element.color");

var colChanger = function() {
mat.css("background-color", jQuery(this).css("background-color"));
};

colors.each(function(e) { jQuery(this).click(colChanger); });
mat.css("background-color", "#222");
</script>

关于javascript - 从事件类中获取值并假设为另一个,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28214543/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com