jQuery判断是否选中
Posted 前端HL
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery判断是否选中相关的知识，希望对你有一定的参考价值。
1.判断check是否选中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>判断check是否被选中</title> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="black" name="apple-mobile-web-app-status-bar-style" /> <meta content="telephone=no" name="format-detection" /> <style type="text/css"> *{margin:0; padding: 0} body{font:14px/1.4 "Microsoft Yahei",Arial,Helvetica,sans-serif;background-color: #fff;color:#333;max-width: 640px;margin: 0 auto;} a{ text-decoration: none; color: #333 } /*btn*/ .public_btn_s {padding: 10px 0; margin: 0 10px;} .public_btn_s a { display: block; height: 34px; line-height: 34px; text-align: center; font-size: 18px; background-color: #31b6e7; color: #fff; border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } </style> </head> <body> <div class="public_agreement"> <input type="checkbox" id="agreeInput" value="on">同意<a href="javascript:;" >个人隐私协议</a> </div> <div class="public_btn_s"> <a href="javascript:;" class="J_ajax_submit_btn">点击查看</a> </div> <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { //按钮点击 $(\'.J_ajax_submit_btn\').on(\'click\',function(){ if($(\'#agreeInput\').length){ if(!($(\'#agreeInput\').is(\':checked\'))){ alert(\'您未同意个人隐私协议\'); return false; }else{ var url = \'http://www.baidu.com\'; window.location.href=url; } } }); }) </script> </body> </html>
2.判断div是否被选中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>判断div是否被选中</title> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="black" name="apple-mobile-web-app-status-bar-style" /> <meta content="telephone=no" name="format-detection" /> <style type="text/css"> *{margin:0; padding: 0} body{font:14px/1.4 "Microsoft Yahei",Arial,Helvetica,sans-serif;background-color: #fff;color:#333;max-width: 640px;margin: 0 auto;} a{ text-decoration: none; color: #333 } /*选项卡*/ .form_tab{ overflow: hidden; background-color: #fffdf0; margin:5px 10px; border:1px solid #f9a268; border-radius: 5px;} .ft_top{ overflow: hidden; height: 37px;line-height: 36px;} .ft_top a{float: left; width: 50%; box-sizing: border-box; border-right:1px solid #f9a268; text-align: center; background-color: #ffedda; border-bottom:1px solid #f9a268;} .ft_top a:last-child{ border-right:0} .ft_top a:hover,.ft_top a.current{ background-color: #fffdf0; border-top:2px solid #db2121; color: #db2121;} .ft_top a.current{ border-bottom:0} .ft_con{overflow: hidden;padding:20px 10px ;} .ft_con a{ height: 25px; line-height: 25px; padding:0 10px; border:1px solid #f9a268; background-color: #ffddbb;float:left; margin:0 5px; border-radius: 3px;} .ft_con a.current{ color: #db2121; border-color: #db2121;} /*btn*/ .public_btn_s {padding: 10px 0; margin: 0 10px;} .public_btn_s a { display: block; height: 34px; line-height: 34px; text-align: center; font-size: 18px; background-color: #31b6e7; color: #fff; border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } </style> </head> <body> <div class="form_tab"> <div class=" ft_top" id="tabMenu"> <a href="javascript:;" class="current">转盘法（排盘法）</a> <a href="javascript:;">飞盘法（排盘法）</a> </div> <div class="ft_con "id="tabCon"> <a href="javascript:;">置润法</a> <a href="javascript:;">拆补法</a> <a href="javascript:;">茅山道人法</a> </div> </div> <div class="public_btn_s"> <a href="javascript:;" class="J_ajax_submit_btn">点击查看</a> </div> <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#tabMenu a").on(\'click\',function () { $(this).addClass(\'current\').siblings().removeClass(\'current\'); }); $(\'#tabCon a\').on(\'click\',function () { $(this).addClass(\'current\').siblings().removeClass(\'current\'); }); //按钮点击 $(\'.J_ajax_submit_btn\').on(\'click\',function(){ if($(\'#tabCon a\').length){ if(!($(\'#tabCon a\').is(\'.current\'))){ alert(\'您未选择排盘方法\'); return false; }else{ var url = \'http://www.baidu.com\'; window.location.href=url; } } }); }) </Jquery if复选框是否已选中Bootstrap开关