javascript - SHOPIFY:如何根据特定变体显示 div
问题描述
我希望根据变体 id 显示特定的 div。有 2 个 div,两者都包含自定义产品输入字段。当显示 div 1 时,应该禁用 div 2 中的字段,反之亦然。
我如何做到这一点?
谢谢!
解决方案
你可以这样做
在您的选择下拉列表中,添加此代码
<select>
{% for variant in product.variants %}
<option data-variant="{{ variant.id }}">{{ variant.title }}</option>
{% endfor %}
</select>
````
{% for variant in product.variants %}
<div class="input_fields" id="div-{{ variant.id }}">
<p>content...</p>
</div>
{% endfor %}
然后你应该有一个像
$(function() {
$('select').on('change', function() {
var selected_variant = $(this).attr('data-variant');
$('.input_fields').hide();
$('#div-'+selected_variant).show();
});
});
PS。代码未经测试!但这会给你一个想法。
推荐阅读
- python - 为什么熊猫的这个数据框不将句子解析为函数
- android - 即使应用程序被杀死,也可以从广播接收器运行并获取事件
- android - Xamarin Forms / Android - Intent Extras 为空
- keras - ValueError: no enough values to unpack (expected 3, got 2) 我想解决这个问题
- regex - 拆分字符串,提取并添加到另一列正则表达式 BIGQUERY
- javascript - React Hooks - 在 onClick 事件期间拼接更新状态有问题
- tensorflow - 我有一个手动分类的 .tfrecord,但不知道如何训练模型,有什么提示吗?
- javascript - SyntaxError: Unexpected token - 在 JSON 中的位置 0(Firebase,Busboy)
- java - SoundPool 未加载?
- scala - 如何处理表定义中的重复列