Javascript jquery在选择选项时显示隐藏文本 选择服务 选择一项服务 机场方向 从机场 开车兜风 点对点 婚礼 正式舞会 毕业典礼 生日 音乐会 体育赛事 周年纪念 机场 选择一个机场 拉瓜迪亚 约翰·F·肯尼迪 韦斯特切斯特 泰特波罗 伊斯利普

我有上述代码，在服务部分，当我单击“从机场或到机场”时，我希望显示机场选项。 提前感谢

试试这个

  <form method="get" action="processform.php">
  <b>SELECT SERVICE</b><select name="Service">
  <option value="">Select a Service</option>
  <option value="toairport">To Airport</option>
  <option value="fromairport">From Airport</option>
  <option value="DriveAround">Drive Around</option>
  <option value="PointToPoint">Point TO Point</option>
  <option value="Wedding">Wedding</option>
  <option value="Prom">Prom</option>
  <option value="Graduation">Graduation</option>
  <option value="Birthday">Birthday</option>
  <option value="Concert">Concert</option>
  <option value="SportingEvents">Sporting Events</option>
  <option value="Anniversary">Anniversary</option>
  </select>

   Airports<select name="airports">
  <option value="">Select an Airport</option>
  <option value="LGA">LaGuardia</option>
  <option value="JFK">Jonh F. Kennedy</option>
  <option value="Westchester">Westchester</option>
  <option value="Terteboro">Terteboro</option>
  <option value="Islip">Islip</option>
  </select>

---

您可能正在寻找以下内容：

$("select[name=Service]").change(function(e){
    if(e.target.value == "toairport" || e.target.value == "fromairport"){
        $("select[name=airports]").show();
    }else{
        $("select[name=airports]").hide();
    }
})

标记：

$("#airports").hide()
$("#service").change(function(){
    if(this.value == 'toairport' || this.value == 'fromairport')
       $("#airports").show();
    else
        $("#airports").hide();
});

演示-->

我建议：

<select name="Service" id="service">
<select name="airports" id="airports">

您还可以使用一个简单的正则表达式来测试

值

是否以单词

airport

结尾（这与发布的要求相匹配，因为您测试的两个选项都以字符串“airport”结尾）：

参考资料：

---

我有上述代码，在“服务”部分，当我单击“从机场或到机场”时，我希望机场的下拉菜单显示出来。我是通过文本完成的，但在“从机场到机场”期间我无法执行“在服务选择菜单中作为选项。哇！这很好+1。我不知道这个技巧。美好的非常感谢，第一个脚本工作得更好，第二个脚本工作得更好，但是不管我点击什么，它都会显示aiport菜单。真的吗？请问您使用什么浏览器来尝试后一种选择？

$('select[name="Service"]').change(function(){
    var v = $(this).val().toLowerCase();
    $('select[name="airports"]').toggle((v == 'toairport' || v == 'fromairport'));
}).change();

$('select[name="Service"]').change(function(){
    var v = $(this).val().toLowerCase();
    $('select[name="airports"]').toggle(v.match(/airport$/));
}).change();