jQuery MiniUI

标题: 怎么选择mini-checkbox让一部分隐藏 [打印本页]

作者: 609013830 时间: 2018-11-21 11:37:00 标题: 怎么选择mini-checkbox让一部分隐藏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<style>
.div{
   width:200px;
   height:200px;
   border:2px solid red;}
</style>
<script>
  $(function(){
   $("input").bind("click",function(){
      if(this.checked){
            $("#"+$(this).attr("traget")).hide();
      }else{
            $("#"+$(this).attr("traget")).show();
            }

      })
   });
</script>
<body>
<input type="checkbox" id="id1" traget="div1">
<label for="id1">div1</label>
<input type="checkbox" id="id2" traget="div2">
<label for="id2">div2</label>
<input type="checkbox" id="id3" traget="div3">
<label for="id3">div3</label>

<div class="div" id="div1">div1</div>
<div class="div" id="div2">div2</div>
<div class="div" id="div3">div3</div>
</body>
</html>

就像上面这个样子，勾上以后一部分被隐藏掉

作者: dforce 时间: 2018-11-21 14:01:04

这使用和你这差不多的
<div class="mini-checkbox" onvaluechanged="onValueChanged"  data-options={target:'div1'}  value="true" text="div1"></div>

function onValueChanged(e) {
      var value = e.value;
      if (value=="true") {
         $("#" + e.sender.target).show();
      } else {
         $("#" + e.sender.target).hide();
      }
}

作者: 609013830 时间: 2018-11-21 15:06:10

dforce 发表于 2018-11-21 14:01
这使用和你这差不多的

用你的方法在data-options={target:'div1'}报了与元素类型 "input" 相关联的属性 "data-options" 应有左引号。的错，我自己找了种方法
               <tr>
               <input  name="searchInhos" class="mini-checkbox" text="筛选住院信息" value="Y" trueValue="Y" falseValue="N" /></td>
                  <td width="190" style="text-align: center;">
                     <a id="searchBtnMst"  class="mini-button search">查询</a>
                  </td>
            </tr>
            <tr id="more">
                  ...
            </tr>

mini.getByName("searchInhos").on("checkedchanged",function (e) {
      if(e.checked!=true) {

         $("#more").css("display","none");
      }else {

         $("#more").css("display","block");
      }
});

但是隐藏完再打开的时候原来的样式就没有了，他有没有什么方法解决

作者: leao 时间: 2018-11-21 15:13:32

609013830 发表于 2018-11-21 15:06
用你的方法在data-options={target:'div1'}报了与元素类型 "input" 相关联的属性 "data-options" 应有左 ...

data-options加上引号，data-options="{target:'div1'}"

作者: dforce 时间: 2018-11-21 16:13:32

609013830 发表于 2018-11-21 15:06
用你的方法在data-options={target:'div1'}报了与元素类型 "input" 相关联的属性 "data-options" 应有左 ...

按道理只是隐藏显示是不会改变元素的样式的。
请提供检查例子来重现你的问题。

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)