如何使用jQuery选择一个选项时，不显示选项

Question

我有这样的select语句：

 <select id = "selectLanguage" name="language" 
    <option value="any" lang="English">All</option><option value="any" lang="French">Tous</option> 
    <option value="french" lang="English">French</option><option value="any" lang="French">Français</option> 
    <option value="english" lang="English">English</option><option value="any" lang="French">Englais</option> 
    </select> 

在CSS：

*:lang(English), *:lang(French) { 
display: none; 
} 

后用户会选择他需要在哪一种语言那个时候我会用show（）来描述适当的元素。

在jQuery中可以选择每个选择的第一个选项取决于显示哪种语言？

现在发生的事情是该语言选择总是显示所有例如

Answer 1

要选择在选择列表中的第一个选项，尝试在选择看着jQuery的.first()

var first = $('select option').first(); 

要选择所选择的选项列表中，尝试寻找在jQuery的:selected Selector

var selected = $('select option:selected'); 

要选择具有特定属性的选项，尝试寻找在jQuery的Attribute Equals Selector

var english = $('select option[lang="English]'); 

结合这些拿到第一个英文选元素，我们得到：

var engSelected = $('select option[lang="English]:selected') 

编辑： 看起来都没有设立你的HTML属性正确，试试这个：

<select id = "selectLanguage" name="language"> 
    <option value="any" lang="English">All</option> 
    <option value="any" lang="French">Tous</option> 
    <option value="french" lang="English">French</option> 
    <option value="french" lang="French">Français</option> 
    <option value="english" lang="English">English</option> 
    <option value="english" lang="French">Englais</option> 
</select> 

注：

您还可以通过属性缩小选择范围，就像这样：

var engEnglish = $('select option[value="english"][lang="English"]'); 

Answer 2

看到这个

$("#selectLanguage option[lang=French]:visible").first().prop("selected","selected"); 
$("#selectLanguage option[lang=English]:visible").first().prop("selected","selected");