Question

我有一个带有多个选项的选项字段下拉列表，我想要做的是选择其中一个尺寸然后显示一个单独的div关于他们选择的尺寸。无论选择何种尺寸，都会显示相同的div。我已尝试在jQuery中使用.change函数但是当重新加载页面并且仍然选择了一个选项时，没有任何更改，因此相对div再次被隐藏，这是什么最佳实践？我曾考虑使用.val（）来显示何时选择了其中一个尺寸？

这是我的代码：

HTML：

<select id="pa_rooflight-size" name="attribute_pa_rooflight-size">
<option value="" selected="selected">Choose an option…</option>
<option value="3000mm-x-1200mm" class="attached enabled" selected="selected">3000mm x 1200mm</option><option value="750mm-x-750mm" class="attached enabled" selected="selected">750mm x 750mm</option><option value="900mm-x-900mm" class="attached enabled">900mm x 900mm</option><option value="1000mm-x-1000mm" class="attached enabled">1000mm x 1000mm</option><option value="1200mm-x-900mm" class="attached enabled">1200mm x 900mm</option><option value="1200mm-x-1200mm" class="attached enabled">1200mm x 1200mm</option><option value="1500mm-x-1000mm" class="attached enabled">1500mm x 1000mm</option><option value="1500mm-x-1500mm" class="attached enabled">1500mm x 1500mm</option><option value="1800mm-x-1000mm" class="attached enabled">1800mm x 1000mm</option><option value="2000mm-x-1000mm" class="attached enabled">2000mm x 1000mm</option><option value="3000mm-x-1000mm" class="attached enabled">3000mm x 1000mm</option>
</select>

JS：

$(function() {
    $('#pa_rooflight-size').change(function(){  
     $('.flushglaze-panel').show(); 
    });
});

Answer 1

你是正确的方式。

$(document).ready(function() {
  $("#pa_rooflight-size").change(function() {
    $(".showPickedVal").show().html($(this).val());
    setTimeout(function() {
      $(".showPickedVal").fadeOut('fast');
    }, 1000);
  });
})

setTimout部分是可选的 - 不知道你是否需要它 - 它会消失 1秒钟后退出。

这是一个有效的Plunkr： https://plnkr.co/edit/mzIGnMXp0ZTMJdXSmfaZ

编辑：

再次阅读您的问题后，我了解您最初想要显示选择框的值。这就是你如何做到的：

$(document).ready(function() {
  $("#pa_rooflight-size").change(function() {
    $(".showPickedVal").show().html($(this).val());
  });
  $(".showPickedVal").show().html($("#pa_rooflight-size").val());
})

https://plnkr.co/edit/FHvpzAlPHfqsQZU3khR1?p=preview

显示div取决于选项字段值

1 个答案: