Skip to main content
se eliminaron 144 caracteres en el cuerpo
Origen Enlace
fwBasic
  • 2.8k
  • 1
  • 13
  • 24
$(function () {
 $(".autoCheckbox").on("click",function () {
  var expr="li input[type=checkbox]",
   $this = $$this=$(event.target);
 
  while ($this.length) {
   $input = $this$input=$this.closest("li").find(expr);
   if ($input.length) {
    if ($this[0]==event.target) {
     checked = $this.prop("checked");
     $input.each(function () {
      $(this).prop("checked", checked)
       .css("opacity","1.0");
     });
    }
    checked=$input.is(":checked");
    $this.prop("checked", checked);.css("opacity",
    if (checked && $input.length!=$this= $this.closest("li").find(expr+":checked").length) {
     $this.css("opacity", ? "0.5");
    } else {
    : $this.css("opacity","1.0");
    }
   }
   $this=$this.closest("ul").closest("li").find(expr.substr(3)+":first");
  }
 });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox" id="Inicio">Inicio
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
  <li>
   <input type="checkbox" id="Mail">Mail
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
$(function () {
 $(".autoCheckbox").on("click",function () {
  var expr="li input[type=checkbox]",
   $this = $(event.target);
 
  while ($this.length) {
   $input = $this.closest("li").find(expr);
   if ($input.length) {
    if ($this[0]==event.target) {
     checked = $this.prop("checked");
     $input.each(function () {
      $(this).prop("checked", checked)
       .css("opacity","1.0");
     });
    }
    checked=$input.is(":checked")
    $this.prop("checked", checked);
    if (checked && $input.length!=$this.closest("li").find(expr+":checked").length) {
     $this.css("opacity","0.5");
    } else {
     $this.css("opacity","1.0");
    }
   }
   $this=$this.closest("ul").closest("li").find(expr.substr(3)+":first");
  }
 });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox" id="Inicio">Inicio
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
  <li>
   <input type="checkbox" id="Mail">Mail
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
$(function () {
 $(".autoCheckbox").on("click",function () {
  var expr="li input[type=checkbox]",$this=$(event.target);
  while ($this.length) {
   $input=$this.closest("li").find(expr);
   if ($input.length) {
    if ($this[0]==event.target) {
     checked = $this.prop("checked");
     $input.prop("checked", checked).css("opacity","1.0");
    }
    checked=$input.is(":checked");
    $this.prop("checked", checked).css("opacity",
     (checked && $input.length!= $this.closest("li").find(expr+":checked").length)
      ? "0.5" : "1.0");
   }
   $this=$this.closest("ul").closest("li").find(expr.substr(3)+":first");
  }
 });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox" id="Inicio">Inicio
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
  <li>
   <input type="checkbox" id="Mail">Mail
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
se añadieron 871 caracteres en el cuerpo
Origen Enlace
fwBasic
  • 2.8k
  • 1
  • 13
  • 24
$(function () {
 $(".autoCheckbox").on("click",function () {
  var autochecked($(this),"liexpr="li input[type=checkbox]",-1);
   while(autochecked($(this),"li$this input[type=checkbox]",-1));
= }$(event.target);
})

function autochecked ($this,expr,checked) {
 var n=0;
while $this.find(expr)$this.each(function (length) {
   $input = $(this)$this.closest("li").find(expr);
   if ($input.length) {
    if (this==event$this[0]==event.target) {
     checked = $(this)$this.prop("checked");
     $input.each(function () {
      $(this).prop("checked", checked);
    }   .css("opacity","1.0");
     });
   x=$(this).prop("checked"); }
   $(this).prop("checked",$input checked=$input.is(":checked"));
   y=$(this) $this.prop("checked", checked);
    if (x!=y) {
    n++;
   }
  checked if&& ($input.length!=$(this)=$this.closest("li").find(expr+":checked").length) {
    $(this) $this.css("opacity","0.5");
    } else {
    $(this) $this.css("opacity","1.0");
    }
   }
 }  $this=$this.closest("ul").closest("li").find(expr.substr(3)+":first");
 return n;}
 });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox">Iniciotype="checkbox" id="Inicio">Inicio
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox">Mailtype="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox">Subtype="checkbox" id="Sub-Mail 2">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox">test1type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox">Subtype="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
  <li>
   <input type="checkbox" id="Mail">Mail
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox">Subtype="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
$(function () {
 $(".autoCheckbox").on("click",function () {
   autochecked($(this),"li input[type=checkbox]",-1);
   while(autochecked($(this),"li input[type=checkbox]",-1));
 });
})

function autochecked ($this,expr,checked) {
 var n=0;
 $this.find(expr).each(function () {
  $input = $(this).closest("li").find(expr);
  if ($input.length) {
   if (this==event.target) {
    checked = $(this).prop("checked");
    $input.each(function () {
     $(this).prop("checked", checked);
    });
   }
   x=$(this).prop("checked");
   $(this).prop("checked",$input.is(":checked"));
   y=$(this).prop("checked");
   if (x!=y) {
    n++;
   }
   if ($input.length!=$(this).closest("li").find(expr+":checked").length) {
    $(this).css("opacity","0.5");
   } else {
    $(this).css("opacity","1.0");
   }
  }
 });
 return n;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox">Inicio
  </li>
  <li>
   <input type="checkbox">Mail
   <ul>
    <li>
     <input type="checkbox">Sub-Mail
    </li>
    <li>
     <input type="checkbox">test1
     <ul>
      <li>
       <input type="checkbox">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox">test1 2
        <ul>
         <li>
          <input type="checkbox">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
$(function () {
 $(".autoCheckbox").on("click",function () {
  var expr="li input[type=checkbox]",
   $this = $(event.target);

  while ($this.length) {
   $input = $this.closest("li").find(expr);
   if ($input.length) {
    if ($this[0]==event.target) {
     checked = $this.prop("checked");
     $input.each(function () {
      $(this).prop("checked", checked)
       .css("opacity","1.0");
     });
    }
    checked=$input.is(":checked")
    $this.prop("checked", checked);
    if (checked && $input.length!=$this.closest("li").find(expr+":checked").length) {
     $this.css("opacity","0.5");
    } else {
     $this.css("opacity","1.0");
    }
   }
   $this=$this.closest("ul").closest("li").find(expr.substr(3)+":first");
  }
 });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox" id="Inicio">Inicio
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
  <li>
   <input type="checkbox" id="Mail">Mail
   <ul>
    <li>
     <input type="checkbox" id="Sub-Mail">Sub-Mail
    </li>
    <li>
     <input type="checkbox" id="test">test
     <ul>
      <li>
       <input type="checkbox" id="Sub-Mail 2">Sub-Mail 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
      <li>
       <input type="checkbox" id="test 2">test 2
        <ul>
         <li>
          <input type="checkbox" id="Sub-Mail 3">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox" id="test 3">test 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>
se añadieron 660 caracteres en el cuerpo
Origen Enlace
fwBasic
  • 2.8k
  • 1
  • 13
  • 24

El siguiente ejemplo cumple con recursividad, algo necesario cuando se trabaja con anidaciones

$(function () {
 $(".autoCheckbox").on("click",function () {
   autochecked($(this),"li input[type=checkbox]",-1);
   while(autochecked($(this),"li input[type=checkbox]",-1));
 });
})

function autochecked ($this,expr,checked) {
 var n=0;
 $this.find(expr).each(function () {
  $input = $(this).closest("li").find(expr);
  if ($input.length) {
   if (this==event.target) {
    checked = $(this).prop("checked");
    $input.each(function () {
     $(this).prop("checked", checked);
    });
   }
   x=$(this).prop("checked");
   $(this).prop("checked",$input.is(":checked"));
   y=$(this).prop("checked");
   if (x!=y) {
    n++;
   }
   if ($input.length!=$(this).closest("li").find(expr+":checked").length) {
    $(this).css("opacity","0.5");
   } else {
    $(this).css("opacity","1.0");
   }
  }
 });
 return n;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox">Inicio
  </li>
  <li>
   <input type="checkbox">Mail
   <ul>
    <li>
     <input type="checkbox">Sub-Mail
    </li>
    <li>
     <input type="checkbox">test1
     <ul>
      <li>
       <input type="checkbox">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox">test1 2
        <ul>
         <li>
          <input type="checkbox">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>

El siguiente ejemplo cumple con recursividad, algo necesario cuando se trabaja con anidaciones

$(function () {
 $(".autoCheckbox").on("click",function () {
   autochecked($(this),"li input[type=checkbox]",-1);
   while(autochecked($(this),"li input[type=checkbox]",-1));
 });
})

function autochecked ($this,expr,checked) {
 var n=0;
 $this.find(expr).each(function () {
  $input = $(this).closest("li").find(expr);
  if ($input.length) {
   if (this==event.target) {
    checked = $(this).prop("checked");
    $input.each(function () {
     $(this).prop("checked", checked);
    });
   }
   x=$(this).prop("checked");
   $(this).prop("checked",$input.is(":checked"));
   y=$(this).prop("checked");
   if (x!=y)
    n++;
  }
 });
 return n;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox">Inicio
  </li>
  <li>
   <input type="checkbox">Mail
   <ul>
    <li>
     <input type="checkbox">Sub-Mail
    </li>
    <li>
     <input type="checkbox">test1
     <ul>
      <li>
       <input type="checkbox">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox">test1 2
        <ul>
         <li>
          <input type="checkbox">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>

El siguiente ejemplo cumple con recursividad, algo necesario cuando se trabaja con anidaciones

$(function () {
 $(".autoCheckbox").on("click",function () {
   autochecked($(this),"li input[type=checkbox]",-1);
   while(autochecked($(this),"li input[type=checkbox]",-1));
 });
})

function autochecked ($this,expr,checked) {
 var n=0;
 $this.find(expr).each(function () {
  $input = $(this).closest("li").find(expr);
  if ($input.length) {
   if (this==event.target) {
    checked = $(this).prop("checked");
    $input.each(function () {
     $(this).prop("checked", checked);
    });
   }
   x=$(this).prop("checked");
   $(this).prop("checked",$input.is(":checked"));
   y=$(this).prop("checked");
   if (x!=y) {
    n++;
   }
   if ($input.length!=$(this).closest("li").find(expr+":checked").length) {
    $(this).css("opacity","0.5");
   } else {
    $(this).css("opacity","1.0");
   }
  }
 });
 return n;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="autoCheckbox">
  <li>
   <input type="checkbox">Inicio
  </li>
  <li>
   <input type="checkbox">Mail
   <ul>
    <li>
     <input type="checkbox">Sub-Mail
    </li>
    <li>
     <input type="checkbox">test1
     <ul>
      <li>
       <input type="checkbox">Sub-Mail 2
      </li>
      <li>
       <input type="checkbox">test1 2
        <ul>
         <li>
          <input type="checkbox">Sub-Mail 3
         </li>
         <li>
          <input type="checkbox">test1 3
         </li>
        </ul>
      </li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>

se añadieron 59 caracteres en el cuerpo
Origen Enlace
fwBasic
  • 2.8k
  • 1
  • 13
  • 24
Loading
Origen Enlace
fwBasic
  • 2.8k
  • 1
  • 13
  • 24
Loading