常用js总结
通过radio来显示/隐藏一个div
<div id="ArbAcei" > <br/> 有无不良反应停药 <input type="radio" name="blfyty" value="y"/>有 <input type="radio" name="blfyty" value="n" checked="true" />无 <div id="ty_reason" style="display:none"> 原因是<br> <input type="checkbox" name="ty_reason" value="阿司匹林过敏"/>阿司匹林过敏 <br> <input type="checkbox" name="ty_reason" value="胃溃疡"/>胃溃疡 <br> <input type="checkbox" name="ty_reason" value="十二指肠溃疡"/>十二指肠溃疡<br> <input type="checkbox" name="ty_reason" value="血小板减少"/>血小板减少<br> <input type="checkbox" name="ty_reason" value="阿司匹林过敏"/>阿司匹林过敏<br> 其他: <input type="text" name="ty_reason_qt"> <br> </div> </div>
引入的js
$(document).ready(function(){
$("input[name='blfyty']").bind("click",function(){
//停药原因
radioEvent_ty_reason($(this));
});
});
function radioEvent_ty_reason(e){
if("blfyty"==e.attr("name")){
if("y"==e.val()){
$("#ty_reason").attr("style","display:''");
}else{
$("#ty_reason").attr("style","display:none");
}
}
}
另外
$("input[name='blfyty']") 是给所有name为blfyty的input加上一个事件
$(":radio") 是给所有type为radio的加上事件
然后我们在对应的函数里,加上e.attr("name") 就可以获得到底是那组radio被点击了
再另外 有$(":radio")自然就还有$(":checkbox")
请参见http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp
第二种获得radio的反应事件
<span style="white-space:pre"> </span> <div id="fyql" style="display:none"> 运用阿司匹林后胃肠道反应强烈 <input type="radio" name="fyql" onclick="ty_reason_fyql(this);" value="强烈"/>强烈 <input type="radio" name="fyql" onclick="ty_reason_fyql(this);" value="不强烈"/>不强烈 <br> </div> <div id="fyql_y" style="display:none"> <font color="red">请选择ADP受体拮抗剂 </font> </div>
js
function ty_reason_fyql(e){
if("强烈"==e.value){
$("#fyql_y").attr("style","display:''");
}else{
$("#fyql_y").attr("style","display:none");
}
}
对复选框中的某一个框 区分点击与取消事件
<div id="ty_reason" style="display:none"> 原因是<br> <input type="checkbox" name="ty_reason" onclick="ty_reason_gm(this);" value="阿司匹林过敏"/>阿司匹林过敏 <br> <input type="checkbox" name="ty_reason" value="胃溃疡"/>胃溃疡 <br> <input type="checkbox" name="ty_reason" value="十二指肠溃疡"/>十二指肠溃疡<br> <input type="checkbox" name="ty_reason" value="血小板减少"/>血小板减少<br> <input type="checkbox" name="ty_reason" value="阿司匹林过敏"/>阿司匹林过敏<br> 其他: <input type="text" name="ty_reason_qt"> <br> </div>
js
function ty_reason_gm(e){
if(e.checked){
alert("yes")
}else{
alert("no");
}
}
另外 结合
$(":checkbox").bind("click",function(){
xx(this); //这里这个this 指的是dom对象
});
function xx(e){
//这个$(e) 是获得封装的jquery对象
if("ty_reason"==$(e).attr("name")){
//checed 是dom对象的属性
if(e.checked){
alert("我选了"+e.value)
}else{
alert("我取消了"+e.value)
}
}
}
就能给每个checkbox加上是否点击事件
若干组radio,只有有一组选了是,就如何如何
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script src="js/jquery1.7.js"></script>
</head>
<body>
<form action="">
是否存在以下不适合应用阿司匹林的情况<br>
胃肠道出血
<input type="radio" name="aspl" value="是" > 是
<input type="radio" name="aspl" value="否" > 否<br>
胃溃疡
<input type="radio" name="wky" value="是" > 是
<input type="radio" name="wky" value="否" > 否<br>
十二指肠溃疡
<input type="radio" name="sez" value="是" > 是
<input type="radio" name="sez" value="否" > 否<br>
<div id="yes" style="display:none">
根据医生评估患者病情给予用药，挽救患者生命为第一位
</div>
<div id="no" style="display:none">
立即给予阿司匹林300mg嚼服
</div>
</form>
</body>
<script type="text/javascript">
$(function(){
$(":radio").click(function(){
check();
});
});
function check(){
var radiolist= $('input:radio:checked');
var show=true;
for(var i=0;i<radiolist.length;i++){
if(radiolist[i].value=='是'){
$("#yes").show();
$("#no").hide();
show=false;
}
}
if(show){
$("#no").show();
$("#yes").hide();
}
}
</script>
</html>
上面的效果是
以上任意选项为是，则根据医生评估患者病情给予用药，挽救患者生命为第一位
如果均为否，则应立即给予阿司匹林300mg嚼服
再另外
var radiolist= $('input:radio.adp:checked');
这是什么意思?
选取class为app的已选的radio
form的提交
<body> <form id="form" method="post"> 评估是否存在<br> 糖尿病肾损伤（GFR<60ml/min/1.73mm） <input type="checkbox" name="x" ><br> 左室功能受损 <input type="checkbox" name="x" ><br> 之前行冠状动脉搭桥术 <input type="checkbox" name="x" ><br> GRACE评分在109~140 <input type="checkbox" name="x" ><br> <input type="button" value="下一步" onclick="xx()" > </form> </body>
function xx() {
var list=document.getElementsByTagName("input");
var form=window.form;
for(var i=0;i<list.length;i++){
if(list[i].checked){
form.action="modules/jxgxb/ycpci.jsp";
form.submit();
return;
}
}
var k=0;
for(var i=0;i<list.length-1;i++){
if(!list[i].checked){
k++;
}
}
if(k==4){
form.action="modules/jxgxb/ywzl.jsp";
form.submit();
}
}
页面跳转方式
self.location.href="modules/jxgxb/ybcl_no.jsp";
常用js总结的更多相关文章
- 常用js方法
function dateGetter(name, size, offset, trim) { offset = offset || 0; return function (date) { var v ...
- 常用JS正则表达式
常用JS正则表达式 收集一些常用的JavaScript正则表达式匹配规则,比如匹配电话号码.Email.中文字符.身份证号.邮编.QQ号.过滤空白行.匹配特定数字等.觉得这玩意是很有用的,只不过自己水 ...
- 常用js方法整理common.js
项目中常用js方法整理成了common.js var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data ...
- 原生JS研究：学习jquery源码，收集整理常用JS函数
原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...
- 项目中常用js方法整理common.js
抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...
- 常用js正则表达式大全
常用js正则表达式大全.一.校验数字的js正则表达式 1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$ 3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和 ...
- api日常总结：前端常用js函数和CSS常用技巧
我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...
- web前端关于html转义符的常用js函数
web前端关于html转义符的常用js函数 //去掉html标签 function removeHtmlTab(tab) { return tab.replace(/<[^<>]+? ...
- 基础常用JS函数和语法
100多个基础常用JS函数和语法集合大全 来源:http://www.cnblogs.com/hnyei/p/4605103.html 网站特效离不开脚本,javascript是最常用的脚本语言,我 ...
- 前端常用js脚本
常用js整理 //获取Url中的参数值 function getQueryString(name) { var reg = new RegExp("(^|&)" + nam ...
随机推荐
- c语言程序第2次作业
(一)改错题 1.输出带框文字:在屏幕上输出以下3行信息. 错误信息1:{{uploading-image-560144.png(uploading...)} 错误原因:stdio误写为stido 错 ...
- js遍历 for-of
for-of遍历 entries() 返回一个遍历器对象,用来遍历[键名, 键值]组成的数组.对于数组,键名就是索引值:对于 Set,键名与键值相同.Map 结构的 Iterator 接口,默认就是调 ...
- 数组查找算法的C语言 实现-----线性查找和二分查找
线性查找 Linear Search 用户输入学生学号的成绩 二分查找 Binary Search 要求数据表是已经排好序的 程序存在小的瑕疵
- Redis持久化的两种方式（RDB和AOF）
redis提供了两种持久化的方式,分别是RDB(Redis DataBase)和AOF(Append Only File). RDB,简而言之,就是在不同的时间点,将redis存储的数据生成快照并存储 ...
- 判断当前设备是移动端或者PC端
<script> function browserRedirect() { var sUserAgent = navigator.userAgent.toLowerCase(); var ...
- python学习之路网络编程篇（第一篇）socket初识
什么是socket 网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为socket.socket通常也称为“套接字”,是一个通信链的句柄,可以用来实现不同虚拟机或不同计算机之间的 ...
- Java第3次实验提纲(面向对象1-基本概念)
0. 将码云的项目clone到本机 请参考使用Eclipse Egit与码云管理你的代码中的3 从码云将项目clone到你的电脑 之后就可以在Eclipse中提交本地项目新增或修改的文件.如果在Ecl ...
- ScrollView嵌套ListView后，进入页面不从顶部开始显示的问题解决
ScrollView嵌套ListView后,进入页面不从顶部开始显示的问题解决 首先,正常情况下,如果在ScrollView里嵌套ListView后,会发现ListView只显示1条数据 那么,为了解 ...
- Swagger API接口管理
介绍 Swagger API框架,用于管理项目中API接口,属当前最流行的API接口管理工具. Swagger功能强大,UI界面漂亮,支持在线测试等! Swagger包 ...
- gloox配置聊天室
gloox配置聊天室 (金庆的专栏) gloox是XMPP协议的C++客户端库.以下代码测试创建多人聊天室(MUC), 并进行配置.参照gloox中的muc示例代码.gloox代码示例中没有聊天室的配 ...