Fatal编程技术网
  • javascript/
  • Javascript 从字符串中删除空白并比较选项值以隐藏/显示DIV

Javascript 从字符串中删除空白并比较选项值以隐藏/显示DIV

javascript jquery

Javascript 从字符串中删除空白并比较选项值以隐藏/显示DIV,javascript,jquery,Javascript,Jquery,我想根据产品的选项值隐藏/显示DIV。基本上，Shopify会自动添加选项值，包括包含多个单词的选项。我没有太多的控制权，所以我想也许我可以从值中删除空白并触发动作 <Select id="single-option-selector-product-template-0"> <option value="Heather Ash">Heather Ash</option> </Select> <div id="HeatherAsh"

我想根据产品的选项值隐藏/显示DIV。基本上，Shopify会自动添加选项值，包括包含多个单词的选项。我没有太多的控制权，所以我想也许我可以从值中删除空白并触发动作

<Select id="single-option-selector-product-template-0">
   <option value="Heather Ash">Heather Ash</option>
</Select>

<div id="HeatherAsh" class="colours" style="display:none">Heather Ash </div>


石南灰
石南灰
这是小提琴==>

回答了一个类似的问题，但这是不同的方法，所以我想我应该创建一个新线程。我是一个JS初学者，所以我的代码非常混乱。非常感谢您的帮助

试试这个

jQuery（函数（）{
jQuery（'#single-option-selector-product-template-0'）.change（function（）{
$（'.colors'）.hide（）；
var optionValue=jQuery（this.val（）；
optionValue=optionValue.replace（/\s+/g'，）；
$（'#'+optionValue）.show（）；
});
});


白色
海军
石南灰
石南灰
白色
海军
石南灰
石南灰

您忘记将显示div的行更改为
$（'#'+optionValue）.show（）：（您没有在聊天中看到此消息吗？）因此，您的最后一行应该是
$（'#'+optionValue）.show（），这将work@Nick抱歉，没有注意到您在聊天中的回复。创建了这个线程，并认为最好将这两种方法分开。你给出的第一个答案在我的一个网站上运行得很好，但在另一个网站上却不起作用，所以我认为这一定与主题或其他脚本有关。再次感谢你的帮助@克莱门茨克很奇怪。这应该更可靠一点——但Shopify一开始就给了你这些糟糕的
id
值，这绝对是一种痛苦！只需去除（石南灰）和（石南灰）之间的空隙