Maison > Article > interface Web > Comment jquery détermine-t-il si une case est cochée (code source)

Comment jquery détermine-t-il si une case est cochée (code source)

云罗郡主avant: 2018-10-29 14:24:405886parcourir

Comment jquery détermine-t-il la case à cocher ? Je crois que de nombreux amis qui viennent d'entrer en contact avec jquery se poseront de telles questions. Ce chapitre vous présentera comment jquery détermine si une case à cocher est cochée. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Tout le monde sait qu'en html, si une case est cochée, elle est vérifiée="cochée". Mais si nous utilisons jquery alert($("#id").attr("checked")), il vous demandera que c'est vrai au lieu de coché. Par conséquent, de nombreux amis jugent que if($("#id").attr("checked")=="true") est faux. En fait, cela devrait être if($("#id").attr(" vérifié") ==true).

L'exemple comprend les fonctions suivantes :

<input type="button" id="btn1" value="全选">
<input type="button" id="btn2" value="取消全选">
<input type="button" id="btn3" value="选中所有奇数">
<input type="button" id="btn4" value="反选">
<input type="button" id="btn5" value="获得选中的所有值">

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
    <TITLE> New Document </TITLE>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <SCRIPT LANGUAGE="JavaScript" src="http://www.cnjquery.com/demo/jquery.js"></script>
        <SCRIPT LANGUAGE="JavaScript">
           $("document").ready(function(){
              $("#btn1").click(function(){
                  $("[name=&#39;checkbox&#39;]").attr("checked",&#39;true&#39;);//全选
   
              });
              $("#btn2").click(function(){
                  $("[name=&#39;checkbox&#39;]").removeAttr("checked");//取消全选
   
              });
              $("#btn3").click(function(){
                  $("[name=&#39;checkbox&#39;]:even").attr("checked",&#39;true&#39;);//选中所有奇数
   
              })
              $("#btn4").click(function(){
                  $("[name=&#39;checkbox&#39;]").each(function(){
                  if($(this).attr("checked"))
                  {
                      $(this).removeAttr("checked");
     
                  }
                  else
                  {
                      $(this).attr("checked",&#39;true&#39;);
     
                  }
              })
          })
               $("#btn5").click(function(){
              var str="";
              $("[name=&#39;checkbox&#39;][checked]").each(function(){
               str+=$(this).val()+""r"n";
             //alert($(this).val());
              })
             alert(str);
              })
   })
  </SCRIPT>
 </HEAD>
 <BODY>
 <form name="form1" method="post" action="">
   <input type="button" id="btn1" value="全选">
   <input type="button" id="btn2" value="取消全选">
   <input type="button" id="btn3" value="选中所有奇数">
   <input type="button" id="btn4" value="反选">
   <input type="button" id="btn5" value="获得选中的所有值">
   <br>
   <input type="checkbox" name="checkbox" value="checkbox1">
   checkbox1
   <input type="checkbox" name="checkbox" value="checkbox2">
   checkbox2
   <input type="checkbox" name="checkbox" value="checkbox3">
   checkbox3
   <input type="checkbox" name="checkbox" value="checkbox4">
   checkbox4
   <input type="checkbox" name="checkbox" value="checkbox5">
   checkbox5
   <input type="checkbox" name="checkbox" value="checkbox6">
   checkbox6
   <input type="checkbox" name="checkbox" value="checkbox7">
   checkbox7
   <input type="checkbox" name="checkbox" value="checkbox8">
 checkbox8
 </form>

Ce qui précède montre comment jquery détermine si la case à cocher est sélectionnée. Introduction complète, si vous. Si vous voulez en savoir plus sur le Tutoriel vidéo JavaScript, veuillez faire attention au site Web PHP chinois.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：Introduction à l'utilisation de la modularité dans ES6 (exemple de code)Article suivant：Introduction à l'utilisation de la modularité dans ES6 (exemple de code)

Articles Liés

Voir plus