README

这是一个简单的 jQuery 插件，用于显示和隐藏元素组 - 例如在表单中。

依赖项

• jQuery > 1.*

安装

以您喜欢的任何方式将包集成到您的项目中。将 src/showgroup.js 包含到您的项目javascript中 - 通常通过与其他脚本一起编译。

使用方法

您可以手动调用 showgroup

<div id="container" data-showgroup-container data-showgroup-default="car">
  <div>
    <label>Vehicle Type</label>
    <select id="vehicle">
      <option value="car" selected>Car</option>
      <option value="bike">Bike</option>
      <option value="van">Van</option>
    </select>
  <div data-showgroups="car,van">
    <label>Engine Size</label>
    <input type="text">
  </p>
  <div data-showgroups="car,van,bike">
    <label>Tyre Pressure</label>
    <input type="text">
  </div>
</div>
<script type="text/javascript">
  $('#container').showgroup()>;
  $('#vehicle').on('change', function() {
    $('#container').showgroup($(this).val());
  });
</script>

您也可以使用懒数据-api 实现此功能。请注意，这样您就需要负责初始化元素的可见性，无论是javascript还是服务器端代码

<div id="container" data-showgroup-container>
  <div>
    <label>Vehicle Type</label>
    <select id="vehicle" data-showgroup-toggle>
      <option value="car">Car</option>
      <option value="bike" selected>Bike</option>
      <option value="van">Van</option>
    </select>
  <div data-showgroups="car,van" style="display: none;">
    <label>Engine Size</label>
    <input type="text">
  </p>
  <div data-showgroups="car,van,bike">
    <label>Tyre Pressure</label>
    <input type="text">
  </div>
</div>

贡献

欢迎贡献和错误修复 - 请提交一个拉取请求。请确保您添加新的qunit测试来覆盖您的更改。