用jquery校验radio单选按钮(原创)

<!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>
时间: 2024-12-13 15:04:10

用jquery校验radio单选按钮(原创)的相关文章

jquery操作radio(单选按钮):动态选中、取值

jquery确实要比js用起来方便多了,尤其是在操作网页里的表单项方面,这章站长和大家分享用Jquery操作单选按钮radio,实现动态选中某个单选按钮和读取选中的单选按钮的值的方法, 本文来自天使建站 www.angelweb.cn 先来看一个实例及代码: <script> $(":radio[name='angelasp'][value='angel']").attr("checked","true"); </script&

jquery操作radio单选按钮、checked复选框。

一.radio 取值: $('input[name=radio]:checked').val(); 二.checked 判断checked是否被选中 $("input[type='checkbox']").is(':checked') 返回结果:选中为true,未选中为false 注意事项: jq重复操作radio.checked的时候无效,使用prop,prop存在于jq高版本中. 设置选中 $("input[name=checked][value=A]").pr

JQuery判断radio(单选框)是否选中和获取选中值方法总结

篇文章主要介绍了JQuery判断radio(单选框)是否选中和获取选中值方法总结,本文讲解了利用获取选中值判断选中.使用checked属性判断选中.jquery获取radio单选按钮的值.获取一组radio被选中项的值.设置单选按钮被选中等内容,需要的朋友可以参考下 一.利用获取选中值判断选中 直接上代码,别忘记引用JQuery包 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

jquery循环遍历radio单选按钮,并设置选中状态

背景:自己在做项目过程中遇到的问题,现在记录一下. 需求:在ajax获取后台数据的之后,需要根据获取的数据对页面中的radio单选按钮进行选中状态设置 因为自身js功底欠佳,所以耽误了点时间,现在把方法写一下 先贴一下html代码,这里就以最简单的代码来演示: <input type="radio" class="optionsRadios" value="1">是 <input type="radio" c

JQuery 为radio赋值问题

今天用jquery 为radio赋值,从百度查了一下方法: $("input[name='radioName'][value=2]").attr("checked",true); 看了好几个页面都是这样的方法,然而在我这没有成功.挺奇怪的,折腾了一个上午,都怀疑人生了!偶然看到一个博客里,讲到了使用 .prop("checked", true)这个方法,可以了!为了防止今后忘掉这件事而重蹈覆辙,留下这篇博客! 我又继续研究了下prop() 和 a

使用jquery获取radio的值

使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1.<input type="radio" name="testradio" value="jquery获取radio的值" />jquery获取radio的值<br /> 2.<input type="radio

js如何获取选中radio单选按钮的值

js如何获取选中radio单选按钮的值:radio单选按钮在是非常常用的表单元素之一,经常需要获取被选中按钮的value属性值,下面就通过实例简单介绍一下如何使用javascript实现此功能,代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.soft

JQuery判断radio是否选中并获取选中值的示例代码

这篇文章主要介绍了JQuery判断radio是否选中并获取选中值的方法,代码很简单,但很实用,需要的朋友可以参考下 其他对radio操作功能,以后在添加.直接上代码,别忘记引用JQuery包 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 <!DOCTYPE html PUBLIC "

jquery 【radio checkbox】选择

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="Jquery/jquery-1.10.2.js" type="text/javascript"></script> <script type="text/javascript"> $(f