jQueryに基づいてチェックボックスが選択されているかどうかを確認して質問に答える

2452 ワード

最近プロジェクトの需要の中で出会った機能点で、ユーザーが選択したオプションによって相応のヒントを与えて、以下はテストプログラムの効果図を提供して、満足しているかどうかを見て、もしみんなが悪くないと思ったら、引き続き全文を見てください.
一、実現の原理:
ステップ1:ユーザーがどの項目を選択するか、すなわちどのチェックボックスが選択されているかを判断します.
ステップ2:チェックボックスの選択状況に応じて、対応するヒントを与える
二、次に主体プログラムを見る.



  
    
    
  
  
    <input type="checkbox" id="checkbox01"/>A <br/>
    <input type="checkbox" id="checkbox02"/>B <br/>
    <input type="checkbox" id="checkbox03"/>C <br/>
    <input type="checkbox" id="checkbox04"/>D <br/>
    <input type="button" id="button" value="  "/>
    <h4>              A</h4>
    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"/>
    <script src="js/layout.js" type="text/javascript" charset="utf-8"/>
  
</code></pre> 
 </div> 
 <p>                  ,      A,         JQ   ~~~<br/> </p> 
 <p><span style="color: #0000ff"><strong> 、jQuery  </strong></span><br/> </p> 
 <div class="jb51code"> 
  <pre><code>
$(function(){
//       A
$("#button").click(function(){
if($("input").filter(":checked").length==0){
alert("          ");
}elsif($("#checkbox01").filter(":checked").length!=0&&$("#checkbox02").filter(":checked").length==0&&$("#checkbox03").filter(":checked").length==0&&$("#checkbox04").filter(":checked").length==0){
alert("          !")
}else{
alert("          !")
}
})
}</code></pre> 
 </div> 
 <p>                   ,            ,   jquery               ,    ,   $("#id").filter(":checked").length==0                 ~~~         ,           ~~~</p> 
 <p>       jQuery                    ,      。</p> 
 <div class="clearfix"> 
  <span id="art_bot" class="jbTestPos"/> 
 </div> 
</div>
                            </div>
                        </div>