Question

我制作一个简单的网站，而不只是根据两个下拉列表的组合显示一些图像，到目前为止我的代码是这样的（html）：

  <p> Origen <select id="origen" > 
  <option>Todos los orígenes</option> 
  <option  >Acapulco</option>
  <option  >Cancún</option>
  <option> Chicago</option>
  <option>Ciudad de México</option>
  <option>Ixtapa/Zihuatanejo</option>
  <option>La Paz</option>
  <option>León</option>
  <option>Los Ángeles</option>
  <option>Mazatlán</option>
  <option>Monterrey</option>
  <option>Morelia</option>
  <option>Ontario</option>
  <option>Reno</option>
  <option>San José, California</option>
  <option>San José, Costa Rica</option>
  <option>Seattle</option>
  <option>Tijuana</option>
  <option>Veracruz</option>
</select>

<p> Destino <select id="destino" > 
  <option>Todos los orígenes</option> 
  <option  >Acapulco</option>
  <option  >Cancú</option>
  <option> Chicago</option>
  <option>Ciudad de México</option>
  <option>Ixtapa/Zihuatanejo</option>
  <option>La Paz</option>
  <option>León</option>
  <option>Los Ángeles</option>
  <option>Mazatlán</option>
  <option>Monterrey</option>
  <option>Morelia</option>
  <option>Ontario</option>
  <option>Reno</option>
  <option>San José, California</option>
  <option>San José, Costa Rica</option>
  <option>Seattle</option>
  <option>Tijuana</option>
  <option>Veracruz</option>
</select>

我已经尝试过jquery和脚本，但我也是这样，我发现的所有示例都只适用于一个下拉列表。

Answer 1

$('#origin, #destino').change(function() {

   var originVal = $('#origin option:selected').val();
   var destinoVal = $('#destino option:selected').val();

   if (originVal == 'somevalue' && detinoVal == 'somevalue') 
   {
      $('img').attr('src','image path');
   }

   //todo: other if statement

});

Answer 2

您没有指定显示图像的方式/位置，但要获取两个选定下拉列表的事件，您可以使用JQuery：

$('#origin, #destino').change(function(){
     if($("#origin").val() && $("#destino").val()){
          $('#yourImage').attr('src','imgPath');
     }
});

jquery基于两个下拉列表组合显示图像

2 个答案: