Home >Web Front-end >JS Tutorial >Sharing the differences between jquery and js for selecting all functions

Sharing the differences between jquery and js for selecting all functions

小云云Original: 2018-01-10 09:24:491493browse

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>

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>

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!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：An in-depth analysis of AjaxFileUpload to implement the Ajax file upload library for a single fileNext article：An in-depth analysis of AjaxFileUpload to implement the Ajax file upload library for a single file

See more

Sharing the differences between jquery and js for selecting all functions

Related articles