武汉市预约献血登记表< ;meta name="viewport" content="width=device-width,Initial-scale=1.0"><br>div、ul、li、span、table、h1~h6、{ <br> margin:0px; padding:0px;<br>}<br>input{ <br> background-color:#eeeee;<br>}<br>i{ <br> color:#FF9900;<br>}<br>label{<br> margin-bottom: 10px;<br>}<br>small{ <br> font-size: 13ピクセル; <br> font-weight:600px;<br>}<br>.xy-navigation{ <br> background-color:#00ab9f;<br>}<br>.xy-navigation ul{ <br> list-style:none; <br> margin-bottom: 0px; <br> padding-left: 0px;<br>}<br>.xy-navigation ul li{ <br> height:50px; <br> line-height:50px;<br>}<br>.xy-navigation ul li img{ <br> width:10px; <br> 高さ:20px;<br>}<br>.xy-navigation-txt{<br> font-size:16px; <br> font-weight:800; <br> 色:#ffffff; <br> text-align:center; <br> padding-left:0px;<br>}<br>.xy-nagation-txt{ <br> font-size:10px; <br> color:#999999;<br>}<br>.xy-nagation-txt スパン{ <br> padding-left: 0px; <br> パディング右: 0px; <br> margin-top: 10px;<br>}<br>.xy-subtxt{<br> margin-top: 14px; <br> カラー:#808080; <br> font-size:13px; <br> font-weight:600px;<br>}<br>.su-form-content{<br> margin-left: 15px; <br> 右マージン: 15px; <br> margin-top: 20px;<br>}<br>.defaule-radius{ border-radius:10px;}<br><br>.su-dropdown{<br> border:1px Solid #dfdfdf; <br> border-radius:10px;<br>}<br>.su-dropdown button{<br> width:100%; <br> text-align:left; <br> 色:#999999; <br> font-size:13px;<br>}<br>.su-radio-all{<br> border:1px Solid #dfdfdf; <br> border-radius:10px; <br> background-color:#eeeeee;<br>}<br>.su-radio-all input{ <br> margin-left:15px;<br>}<br>.su-radio-all div{<br> padding-top:7.5px; <br> padding-bottom:7.5px; <br> padding-left: 10px; <br> マージントップ: 0px; <br> margin-bottom: 0px;<br>}<br>.radio-women{<br> padding-top:7.5px; <br> padding-bottom:7.5px; <br> padding-left: 10px; <br> マージントップ: 0px; <br> margin-bottom: 0px;<br> border-top:1px Solid #dfdfdf;<br>}<br>.su-dropdown-date{<br> width:100%; <br> text-align:left; <br> 色:#999999; <br> font-size:13px;<br>}<br>.su-dropdown-date button{ width:100%;border-top:1px Solid #dfdfdf; border-radius:10px;}<br>.drop-date{<br> width:100%; <br> マージントップ: 0px; <br> パディングトップ: 0px; <br> padding-bottom: 0px;<br> border-bottom:0px;<br>}<br>li{<br> border-bottom:1px Solid #eeeeee;<br>}<br>.dropdown-menu >リー> div{<br> clear:both<br> color:#333;<br> font-weight:400;<br> line-height:1.42857;<br> padding:3px 20px;<br> white-space:nowrap; <br>}<br><br>*::before, *::after {<br> box-sizing: border-box;<br>}<br>*::before, *::after {<br> box-sizing: border-box;<br>}<br>.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {<br> border-top: 0px solid #ddd;<br> line-height: 1.42857;<br> padding: 8px;<br> vertical-align: top;<br>}<br><br>.btn-footer p button{width:100%; text-align:center; font-weight:600; border-radius:10px;}<br>.btn{ text-align:left;}<br>.dropdown-menu{ width:100%;}<br>.xy-radio{ border:1px solid #dfdfdf; border-radius:10px; background-color:#eeeeee;}/*<br>.xy-radio p{ padding-left:12px; margin-bottom: 0px; padding-top:6px; padding-bottom:6px; padding-right:12px;}*/<br>.form-group .bg-input{ background-color:#eeeeee;}<br>.xy-radio-p1{<br> border-bottom:1px solid #dfdfdf;<br>}<br><br>#woman-radio{<br> margin-right:10px;<br>}<br>#man-radio{<br> margin-right:10px;<br>}<br>#sub{<br> margin-right:10px;<br>}<br>#sub-button{ width:100%;}<br>.clearboth{ clear:both;}<br><br><br>.xue-div1{ padding:0px 15px 0 15px; height: 35px;}<br>.xue-div1 span{ position:relative; margin-left: 5px; top: -21px;}<br>.xue-div2{padding:0px 15px 0 15px; border-top:1px solid #dfdfdf; height: 35px;}<br>.xue-div2 span{ position:relative; margin-left: 5px; top: -21px;}<br><br>.sex-div1{ padding:0px 15px 0 15px; height: 35px;}<br>.sex-div1 span{ position:relative; margin-left: 5px; top: -29px;}<br>.sex-div2{padding:0px 15px 0 15px; border-top:1px solid #dfdfdf; height: 35px;}<br>.sex-div2 span{ position:relative; margin-left: 5px; top: -29px;}<br><br>.su-radio-all input{opacity:0; width:100%; border-bottom:1px solid #ffffff; visibility:hidden;}<br>.su-radio-all label{width:13px; height:13px; background:url(images/bt2.png); background-size:13px 13px; border-radius:100%; position:relative; top:-18px;}<br>.su-radio-all input[type="radio"]:checked + label{background:url(images/bt1.png) no-repeat; background-size:13px 13px;}<br><br><br>.xy-radio input{opacity:0; width:100%; border-bottom:1px solid #ffffff; visibility:hidden;}<br>.xy-radio label{width:13px; height:13px; background:url(images/bt2.png); background-size:13px 13px; border-radius:100%; position:relative; top:-10px;}<br>.xy-radio input[type="radio"]:checked + label{background:url(images/bt1.png) no-repeat; background-size:13px 13px;}<br><br>select{ display:none; outline:none;}<br>a{text-decoration:none;}<br>*{margin:0;padding:0;}<br>ul{ list-style:none;}<br>.select_box{<br> background-color:#eeeeee;<br> border-radius:10px;<br> line-height:2.5;<br> font-size:14px;<br> color:#999999;<br> width:100%;<br> margin:0px auto;<br>}<br>.select_showbox{<br> border:1px solid #dfdfdf;<br> border-radius:10px;<br> height:35px;<br> padding-left:10px;<br> background:url(images/bt3.png) no-repeat 156px 0;<br> background-size: 13px 10px;<br> background-position: 97.76% 13px;<br>}<br>.select_option{<br> border:1px solid #dfdfdf;<br> border-radius:10px;<br> border-top: none;<br> display:none;<br>}<br>.select_option ul{border-radius:10px;}<br>.select_option li{<br> padding-left:5px;<br> border-top:1px solid #dfdfdf; <br>}<br>.select_option li.selected{<br> background-color:#F3F3F3;<br> color:#999;<br>}<br>.select_option li.hover{ <br> background:#7b6959;<br> color:#fff;<br>}<br> 武汉市预约献血登记表 预约献血可以对您提供更好的服务,免去您排队等待的时间。 如遇人数满员情况,我们会与您联系进行调整。 谢谢您对无偿献血事业的付出! * 姓名: * 性别: 男 女 * 手机号: * 献血区域: ?口献血点(全血) A型血 B型血 C型血 * 预约日期: 2015年3月29日(周五) 2015年3月30日(周六)下午 2015年3月31日(周日)上午 2015年4月01日(周一)下午( * 献血类型: 全血 单采成分血 备注: 确认预约 <br>function sex(){<br> var rs=document.getElementsByName('a');<br> for(var i=0; i<rs.length;i++){<br> if(rs[i].check){<br> alert(rs[i].value==0?"女":"男");<br> break;<br> }<br> }<br>}<br><br>(function($){<br> //获取select<br> var selects=$('select');<br> for(var i=0; i<selects.length;i++){<br /> createSelect(selects[i],i); <br /> }<br /> function createSelect(select_container, index){<br /> var tag_select=$('<div></div>');<br> tag_select.attr('class','select_box');<br> tag_select.insertBefore(select_container);<br> <br> var select_showbox=$('<div></div>');<br> //容易に出错appendTo<br> select_showbox.css('cursor','pointer').attr('class','select_showbox').appendTo(tag_select);<br> // 容易に出错<br> var_オプション=$ ('<ul></ul>')<br> ul_option.attr('class','select_option');<br> ul_option.appendTo(tag_select);<br> createOptions(index,ul_option);<br> <br> <br> tag_select.toggle( function(){<br> ul_option.show(); <br> },function(){<br> ul_option.hide(); <br> <br> var li_option=ul_option.find('li');<br> li_option.on('click ',function(){<br> $(this).addClass('selected').siblings().removeClass('selected');<br> var value=$(this).text();<br> select_showbox.text(value) ;<br> ul_option.hide();<br> });<br><br> li_option.hover(function(){<br> $(this).addClass('hover').siblings().removeClass('hover'); <br> },関数(){<br> li_option.removeClass('hover');<br> });<br> <br> }<br> function createOptions(index,ul_list){<br> //获取被选中の要素并将其值赋值到显示框中<br> var options= selects.eq(index).find('option'),<br> selected_option=options.filter(':selected'),<br> selected_index=selected_option.index(),<br> showbox=ul_list.prev();<br> showbox.text( selected_option.text());<br> <br> //每个オプション建立个li并赋值<br> for(var n=0;n<options.length;n++){<br /> var tag_option=$('& lt;li><; /li>'),//li はoptionに相当します<br> txt_option=options.eq(n).text();<br> tag_option.text(txt_option).css('cursor','pointer').appendTo(ul_list); <br><br> //被选中の元素追加class forselected<br> if(n==selected_index){<br> tag_option.attr('class','selected');<br> } <br> }<br> }<br> <br>})(jQuery)<br> <br>