Javascript 如何使用jquery隐藏表单选项

我有html表单：

<select id="selection" name="type">
    <option value="Interior">Interior</option>
    <option value="Music">Music</option>
</select>
<select id="whichvideo" name="vidtype">
    <option value="">Choose video type</option>
    <option value="Youtube">Youtube</option>
    <option value="Vimeo">Vimeo</option>
    <option id="soundcloud1" value="Soundcloud">Soundcloud</option>
</select>

用这个

---

为什么当我选择音乐，然后返回到内部的形式。它没有隐藏Soundcloud选项吗？

这在Firefox30中对我来说很好

---

我刚刚在fiddle中添加了jQuery库。如果您要找其他东西，请告诉我。

您的小提琴有几个问题：

您没有包含jQuery，因此JS根本不起作用。 您在选择中有一个选择 以下是更新版本：

---

您将无法在不同的浏览器中使用此功能。您可以在删除之前存储select的副本

:

在Firefox中工作，但Chrome不支持此功能

---

@MorKadosh这实际上是validstill不起作用可能的副本必须是下面答案之一中的跨浏览器内容，因为这对meThis很好，这太不公平了，我投了反对票。请有人解释为什么我有他们！！！这是一个完全正确的问题@Maximilian在chrome版本34.0.1788.0和firefox 30中的工作方式正是你想要的，问题是它不能在页面加载上工作，这就是你想要的吗？正如我提到的，当我选择音乐，然后以表单返回内部时，我说了为什么。它不会隐藏Soundcloud选项吗？你测试的firefox/chrome版本是哪一个版本？版本35.0.1916.153，似乎不太正常

$("#selection").change(function () {
    if ($(this).find("option:selected").val() === "Music") {
        $("#soundcloud1").show();
    } else {
        $("#soundcloud1").hide();
    }
});

<select id="selection" name="type">
    <option value=".......">.......</option>
    <option value="Art">Art</option>
    <option value="Architecture">Architecture</option>
    <option value="Bikes">Bikes</option>
    <option value="Fashion">Fashion</option>
    <option value="Films">Films</option>
    <option value="Food">Food</option>
    <option value="Games">Games</option>
    <option value="Interior">Interior</option>
    <option value="Music">Music</option>
    <option value="Photography">Photography</option>
    <option value="Technology">Technology</option>
    <option value="Video">Video</option>
</select>

<select id="whichvideo" name="vidtype">
    <option value="">Choose video type</option>
    <option value="Youtube">Youtube</option>
    <option value="Vimeo">Vimeo</option>
    <option id="soundcloud" value="Soundcloud">Soundcloud</option>
</select>

$("#selection").change(function () {
    if ($(this).find("option:selected").val() === "Music") {
        $("#soundcloud").show();
    } else {
        $("#soundcloud").hide();
    }
});

$("#selection").change(function () {   
    if ($(this).val() === "Music") {
        $("#whichvideo option[value='Soundcloud']").show();
    } else {       
        $("#whichvideo option[value='Soundcloud']").hide();
    }
});