Question

我有一个选择选项，选中后应该显示相应的部分。默认情况下，所有内容都设置为ENSession.SharedSession.AuthenticateToEvernote();。

在这种情况下，如果选择了June，那么我希望它显示所有具有display:none类的div。

june

代码可以正常工作。但是，我想更有效地写这个，因为我计划增加额外的月份。为此，我将如何做一些与此相关的事情：

 $('#list').change(function() {
     if ($(this).val() == "june") {
         $('.june').css('display', 'block')
     }
 });

其中$('#list').change(function() { if ($(this).val() == { thischosenmonth }) { $('.{thischosenmonth}').css('display', 'block') } });是否与用户选择的月份一致？

Answer 1

您可以先将所有月份设置为display:none;（我会使用hide()），然后使用下拉列表的值为相应的月份选择设置display:block;（我会使用show()。因此，如果HTML看起来像这样（显然有更多的月份）：

<select id='sel-month'>
  <option disabled selected>Choose a Month</option>
  <option value='january'>January</option>
  <option value='february'>February</option>
  <option value='march'>March</option>
</select>
<div class='month january'>This is the January box.</div>
<div class='month february'>This is the February box.</div>
<div class='month march'>This is the March box.</div>

您可以使用这样的脚本在下拉列表更改时显示相应月份的信息：

$('#sel-month').change(function(){
    $('.month').hide();
  $('.' + $(this).val()).show();
});

这是一个小提琴：https://jsfiddle.net/1yk44zbq/

将我的css类作为对象引用？

1 个答案: