这个jQuery插件允许一个选择框根据用户的选择显示某些值。它的工作原理是允许用户在隐藏或显示之间切换不同的值。

例如，如果您有一个显示语言选择器的国家/地区选项的选择框，则可以根据选择的语言设置不同的隐藏值。

如何使用它:

1.创建可以有条件地隐藏和显示的多个文本内容。

<p data-language="fr" class="lead">Bonjour le monde!</p>
<p data-language="en" class="lead">Hello World!</p>
<p data-language="de" class="lead">Hallo Welt!</p>
<p data-language="cn" class="lead">你好世界!</p>
<p data-language="jp" class="lead">こんにちは世界!</p>

2.创建一个选择框，其中包含在文本之间切换的选项。

<select id="select">
  <option value="fr">French</option>
  <option value="en">Enlish</option>
  <option value="de">German</option>
  <option value="cn">Chinese</option>
  <option value="jp">Japan</option>
</select>

3.在jQuery之后加载主JavaScript。

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/lib/index.js"></script>

4.启用选择框以在文本之间切换。

$("#select").on("change", function () {
  $.setLanguage({
    attribute: "data-language",
    lang: $(this).val()
  });
});

5.设置要显示的初始文本。

$.setLanguage({
  attribute: "data-language", 
  lang: "fr"
});

预览截图

基于用户选择切换内容 jQuery插件