jQuery 查找选项文本而不是使用 Val

发布于 2024-12-10 03:45:26 字数 851 浏览 0 评论 0原文

我有一个下拉选择框并使用 jQuery if 语句我想设置一个带有一些文本的 div 元素,这是我的代码:

<select id="drop">
    <option value="Select">Choose an option...</option> 
    <option value="Blue" stock="0">Blue</option>
    <option value="Pink,15.00" stock="1">Pink</option>
    <option value="Red" stock="2">Red</option>  
</select>



$('#drop').change(function() {

   if ($(this).val() == 'Pink,15.00') { 
     $(".price-tag > span").text("Pink 15.00");
   }

  if ($(this).val() == 'Red') { 
     $(".price-tag > span").text("Red 5.00");
  }

  else {
     $(".price-tag > span").text("5.00");

  }  
});

当我在下拉列表中选择红色选项时,上面的代码工作正常,但选择粉红色时它不起作用,我相信 jQuery 对包含逗号或句点“Pink,15.00”的 if 语句 .val 有问题。

我可以解决这个问题的一种方法是检查选项中的文本,而不是值。但不知道如何做到这一点,比如选项:选择。

帮助表示赞赏。

谢谢

I have a drop down selection box and using jQuery if statements i want to set a div element with some text, heres my code:

<select id="drop">
    <option value="Select">Choose an option...</option> 
    <option value="Blue" stock="0">Blue</option>
    <option value="Pink,15.00" stock="1">Pink</option>
    <option value="Red" stock="2">Red</option>  
</select>



$('#drop').change(function() {

   if ($(this).val() == 'Pink,15.00') { 
     $(".price-tag > span").text("Pink 15.00");
   }

  if ($(this).val() == 'Red') { 
     $(".price-tag > span").text("Red 5.00");
  }

  else {
     $(".price-tag > span").text("5.00");

  }  
});

The above code works fine when i select the Red option in the dropdown but it's not working when the Pink is selected, i believe jQuery has problems with the if statement .val containing a comma or fullstop "Pink,15.00".

A way i could get around this is by checking the text in the option, not the value. Not sure how to do this though, something like option:selected.

Help appreciated.

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

口干舌燥 2024-12-17 03:45:26

在第二个 if 语句之前添加一个 else。目前,最后一个else条件总是在值不是红色时执行,覆盖之前设置的“粉红色”。

$('#drop').change(function() {
    if ($(this).val() == 'Pink,15.00') { 
       $(".price-tag > span").text("Pink 15.00");
    }
    else if ($(this).val() == 'Red') { //Add else!
       $(".price-tag > span").text("Red 5.00");
    }
    else {
       $(".price-tag > span").text("5.00");
    }  
});

Add an else before the second if statement. Currently, the last else condition is always executed when the value is not red, overwriting the previously set "pink".

$('#drop').change(function() {
    if ($(this).val() == 'Pink,15.00') { 
       $(".price-tag > span").text("Pink 15.00");
    }
    else if ($(this).val() == 'Red') { //Add else!
       $(".price-tag > span").text("Red 5.00");
    }
    else {
       $(".price-tag > span").text("5.00");
    }  
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文