您的位置：首页 > Web前端 > JQuery

用jquery校验radio单选按钮（原创）

2015-11-20 18:23 501 查看 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>预约骨科医生</title>
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">

<link href="<?php echo base_url('assets/css/order.css') ?>" rel="stylesheet" type="text/css">
<script type="text/javascript" src="<?php echo base_url('assets/js/jquery.min.js') ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/js/main.js') ?>"></script>
</head>

<body id="wrap" style="">
<style>
.deploy_ctype_tip{z-index:1001;width:100%;text-align:center;position:fixed;top:50%;margin-top:-23px;left:0;}.deploy_ctype_tip p{display:inline-block;padding:13px 24px;border:solid #d6d482 1px;background:#f5f4c5;font-size:16px;color:#8f772f;line-height:18px;border-radius:3px;}
</style>
<div class="banner">
<div id="wrapper">
<div id="scroller" style="float:none">
<ul id="thelist"><img src="<?php echo base_url('assets/img/wx-logo-1.jpg') ?>" alt="预约骨科医生" style="width:100%">
</ul>
</div>
</div>
<div class="clr"></div>
</div>
<div class="cardexplain">
<ul class="round">
<li>
<h2>预约骨科医生</h2>
<div class="text">
北京市XX骨科竭诚为您服务<br/>
联系电话：001-XXXXXXXX</div>
</li>
</ul>
<form method="post" action="<?php echo base_url("booking/go_select_hospital"); ?>" id="form" >
<ul class="round">
<li class="title mb"><span class="none">请选择医生</span></li>
<li class="nob">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="kuang">
<tbody>
<!-- 二维数组输出表格 -->
<?php foreach($dr_list as $k => $v){ ?>
<tr>
<th><?php echo $v['dr_name']; ?></th>
<td>
<?php echo $v['dr_hospital'].' '.$v['dr_title']; ?>
</td>
<td>
<input type="radio" name="dr_id" value="<?php echo $v['dr_id']; ?>" />
</td>
</tr>
<?php } ?>
</tbody>
</table>
</li>
</ul>

<div class="footReturn" style="text-align:center">
<input id="nextBtn" type="submit" style="margin:0 auto 20px auto;width:90%" class="submit" value="下一步 选择医院">
</div>
</form>
<form method="post" action="<?php echo base_url("booking/go_select_dept"); ?>" id="form" >
<div class="footReturn" style="text-align:center">
<input type="submit" style="margin:0 auto 20px auto;width:90%" class="submit" value="返回上一步 选择科室">
</div>
</form>

<script>
function showTip(tipTxt) {
var div = document.createElement('div');
div.innerHTML = '<div class="deploy_ctype_tip"><p>' + tipTxt + '</p></div>';
var tipNode = div.firstChild;
$("#wrap").after(tipNode);
setTimeout(function () {
$(tipNode).remove();
}, 1500);
}
//校验单选按钮是否选中
$(function(){
$("#nextBtn").click(function(){
var boolCheck=$('input:radio[name="dr_id"]').is(":checked");
if(boolCheck == false){
showTip('请选择医生');
return false;
}
return true;
});
});

</script>
</div>

</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航