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

【问题标题】：jQuery Finding Option Text Instead of Using ValjQuery 查找选项文本而不是使用 Val
【发布时间】：2011-12-06 12:36:35
【问题描述】：

我有一个下拉选择框并使用 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 的 if 语句 .val 包含逗号或句号“Pink,15.00”时存在问题。

我可以解决这个问题的一种方法是检查选项中的文本，而不是值。但不确定如何执行此操作，例如 option:selected。

帮助表示赞赏。

谢谢

【问题讨论】：

标签： jquery if-statement

【解决方案1】：

在第二个 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");
    }  
});

【讨论】：