Sharing the differences between jquery and js for selecting all functions-JS Tutorial-php.cn

Sharing the differences between jquery and js for selecting all functions

小云云

Release： 2018-01-10 09:24:49

Original

1454 people have browsed it

This article mainly introduces the difference between jquery and js to implement the select all function. Friends in need can refer to it. I hope it can help everyone.

1. Commonly used events in jquery

click(),dbclick()

focus(),blur()

change()

keydown(),keypress(),keyup()

mousedown(),mouseup() mouseenter(),mouseleave() mouseover(),mouseout() mousemove()

2. jquery hanging event

$（“p”）.bind(“event name”, anonymous function to be executed)

$（“p”).unbind(“event name” )

3. jquery implements the select all function (the focus is on using .prop() for attributes instead of .attr())

The code is as follows:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="{utf-8}">
    <title></title>
    <script src="../jquery-3.2.0.js"></script>
  </head>
  <body>
    <form>
      <input type="checkbox" class="all"/>省市<br />
      <input type="checkbox" class="a"/>山东
      <input type="checkbox" class="a"/>山西
      <input type="checkbox" class="a"/>北京
      <input type="checkbox" class="a"/>河北
      <input type="checkbox" class="a"/>江苏
    </form>
  </body>
</html>
<script>
  $(".all").click(function(){
//    alert($(this)[0].checked);//如果选中则返回true;否则返回false
    var a= $(this)[0].checked; //dom对象
//   alert($(this).prop("checked"));
     var a=$(this).prop("checked");//获取jquery对象
//改变子复选框的状态 用prop代替attr，解决了之前用js写出现的bug,但是在源代码中查不到
  $(".a").prop("checked",a); 
  })
</script>

Copy after login

Compare js select all Code: {For details on 2017-05-03, see Data Access (Multiple Condition Query for Rent a House)}

function quanxuan(a,ff)
{
  var ck = document.getElementsByClassName(ff);
  if(a.checked)
  {
    for(var i=0;i<ck.length;i++)
    {
      ck[i].setAttribute("checked","checked");
    }
  }
  else
  {
    for(var i=0;i<ck.length;i++)
    {
      ck[i].removeAttribute("checked");
    }
  }
}
</script>

Copy after login

In addition, jquery can replace all functions of js, except settimeout and setinterval.

Related recommendations:

Use Javscript to implement the all-select function of form check boxes_Form special effects

Write one with jquery checkbox——Similar to the mailbox select all function_jquery

Simple Jquery select all function_jquery

The above is the detailed content of Sharing the differences between jquery and js for selecting all functions. For more information, please follow other related articles on the PHP Chinese website!