c#+jquery实现获取radio和checkbox的值


Posted in Javascript onSeptember 12, 2020

废话不多说,直接上代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Web2.aspx.cs" Inherits="Chapter2.Web2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<script src="jquery-1.8.0.js"></script>

<script type="text/javascript">

$(function () {

$("#sub").click(function () {

var str1 = "张三:" + $("#name").val();

var str2 = "性别:" + $('input:radio[name = "sex"]:checked').val();

var shuzu = [];

$('input:checkbox[name = "aihao"]:checked').each(function () {//each每个

shuzu.push($(this).val());//给数组赋值

});

window.alert(str1 + '\n' + str2 + '\n' + "爱好:" + shuzu);

});

});

</script>

</head>

<body>

<form id="form1" runat="server">

姓名:<input type="text" id="name" /><br />

性别:<input type="radio" id="nan" name="sex" checked="" value="男" />男<input type="radio" id="nv" name="sex" value="女" />女<br />

爱好:<input type="checkbox" />游泳

<input type="checkbox" name="aihao" value="爬山" />爬山

<input type="checkbox" name="aihao" value="打球" />打球

<input type="checkbox" name="aihao" value="骑车" />骑车

<input type="checkbox" name="aihao" value="阅读" />阅读

<input type="checkbox" name="aihao" value="聊天" />聊天<br />

<input type="button" id="sub" value="提交" /><input type="button" id="b" value="重置" />

</form>

</body>

</html>

代码很简洁,却很实用,小伙伴们根据自己的项目需求改写下即可使用。

Javascript 相关文章推荐
学习ExtJS form布局
Oct 08 Javascript
JS实现商品倒计时实现代码
May 03 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
Dec 11 Javascript
javascript实现修改微信分享的标题内容等
Dec 11 Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
Dec 23 Javascript
JS获取随机数和时间转换的简单实例
Jul 10 Javascript
AngularJS bootstrap启动详解及实例代码
Sep 14 Javascript
jQuery使用方法
Feb 04 Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
Sep 14 Javascript
JavaScript实现图片本地预览功能【不用上传至服务器】
Sep 20 Javascript
使用VueRouter的addRoutes方法实现动态添加用户的权限路由
Jun 03 Javascript
如何基于viewport vm适配移动端页面
Nov 13 Javascript
express的中间件cookieParser详解
Dec 04 #Javascript
express的中间件bodyParser详解
Dec 04 #Javascript
express的中间件basicAuth详解
Dec 04 #Javascript
详解JS函数重载
Dec 04 #Javascript
如何让你的Lightbox支持滚轮缩放及Base64图片
Dec 04 #Javascript
javascript常用代码段搜集
Dec 04 #Javascript
5种处理js跨域问题方法汇总
Dec 04 #Javascript
You might like
php断点续传之如何分割合并文件
2014/03/22 PHP
destoon数据库表说明汇总
2014/07/15 PHP
PHP中filter函数校验数据的方法详解
2015/07/31 PHP
CodeIgniter表单验证方法实例详解
2016/03/03 PHP
PHP7.1实现的AES与RSA加密操作示例
2018/06/15 PHP
JavaScript 学习技巧
2010/02/17 Javascript
JavaScript使用过程中需要注意的地方和一些基本语法
2010/08/26 Javascript
qTip 基于JQuery的Tooltip插件[兼容性好]
2010/09/01 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
js冒泡法和数组转换成字符串示例代码
2013/08/14 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
javascript实现带下拉子菜单的导航菜单效果
2015/05/14 Javascript
js实现iframe框架取值的方法(兼容IE,firefox,chrome等)
2015/11/26 Javascript
Vue.js每天必学之组件与组件间的通信
2016/09/08 Javascript
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
基于javascript中的typeof和类型判断(详解)
2017/10/27 Javascript
js实现复制功能(多种方法集合)
2018/01/06 Javascript
React组件refs的使用详解
2018/02/09 Javascript
nodejs实现超简单生成二维码的方法
2018/03/17 NodeJs
修改npm全局安装模式的路径方法
2018/05/15 Javascript
如何解决vue2.0下IE浏览器白屏问题
2018/09/13 Javascript
vue移动端实现手机左右滑动入场动画
2020/06/17 Javascript
Django rstful登陆认证并检查session是否过期代码实例
2019/08/13 Python
html5中JavaScript removeChild 删除所有节点
2014/05/16 HTML / CSS
美国网上花店:JustFlowers
2017/02/12 全球购物
施华洛世奇意大利官网:SWAROVSKI意大利
2018/07/23 全球购物
学习心得体会
2014/01/01 职场文书
学习雷锋精神演讲稿
2014/05/10 职场文书
关于运动会广播稿200字
2014/10/08 职场文书
员工工作及收入证明
2014/10/28 职场文书
怎样写辞职信
2015/02/27 职场文书
2015年董事长秘书工作总结
2015/07/23 职场文书
2016教师给学生的毕业寄语
2015/12/04 职场文书
读《儒林外史》有感:少一些功利,多一些真诚
2020/01/19 职场文书
关于Python OS模块常用文件/目录函数详解
2021/07/01 Python
彻底弄懂Python中的回调函数(callback)
2022/06/25 Python