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 相关文章推荐
Javascript document.referrer判断访客来源网址
May 15 Javascript
JavaScript 轻松搞定快捷留言功能 只需一行代码
Apr 01 Javascript
Javascript面向对象编程(二) 构造函数的继承
Aug 28 Javascript
javascript禁止访客复制网页内容的实现代码
Aug 05 Javascript
微信小程序日历组件calendar详解及实例
Jun 08 Javascript
JavaScript基于扩展String实现替换字符串中index处字符的方法
Jun 13 Javascript
JavaScript编写棋盘覆盖代码详解
Aug 28 Javascript
JS实现点击链接切换显示隐藏内容的方法
Oct 19 Javascript
JS运动改变单物体透明度的方法分析
Jan 23 Javascript
浅谈vue方法内的方法使用this的问题
Sep 15 Javascript
VUE引入第三方js包及调用方法讲解
Mar 01 Javascript
详解Anyscript开发指南绕过typescript类型检查
Sep 23 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 mb_convert_encoding文字编码的转换函数介绍
2011/11/10 PHP
PHP遍历文件夹与文件类及处理类用法实例
2014/09/23 PHP
PHP编译安装时常见错误解决办法
2015/05/28 PHP
WordPress分页伪静态加html后缀
2016/06/08 PHP
Yii2表单事件之Ajax提交实现方法
2017/05/04 PHP
事件绑定之小测试  onclick &amp;&amp; addEventListener
2011/07/31 Javascript
JS代码优化技巧之通俗版(减少js体积)
2011/12/23 Javascript
node.js中的http.response.end方法使用说明
2014/12/14 Javascript
Window.Open打开窗体和if嵌套代码
2016/04/15 Javascript
关于JavaScript和jQuery的类型判断详解
2016/10/08 Javascript
angularjs实现搜索的关键字在正文中高亮出来
2017/06/13 Javascript
vue中Element-ui 输入银行账号每四位加一个空格的实现代码
2018/09/14 Javascript
浅析Vue中拆分视图层代码的5点建议
2019/08/15 Javascript
js实现坦克大战游戏
2020/02/24 Javascript
基于Vue CSR的微前端实现方案实践
2020/05/27 Javascript
OpenLayers3实现地图显示功能
2020/09/25 Javascript
[02:32]DOTA2完美大师赛场馆静安体育中心观赛全攻略
2017/11/08 DOTA
[01:03:03]VP vs Mineski 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
Python subprocess模块学习总结
2014/03/13 Python
django允许外部访问的实例讲解
2018/05/14 Python
Python 使用type来定义类的实现
2019/11/19 Python
利用python读取YUV文件 转RGB 8bit/10bit通用
2019/12/09 Python
Flask中endpoint的理解(小结)
2019/12/11 Python
python打印异常信息的两种实现方式
2019/12/24 Python
html5 canvas绘制网络字体的常用方法
2019/08/26 HTML / CSS
英国最大的专业户外零售商:Mountain Warehouse
2018/06/06 全球购物
大学同学十年聚会感言
2014/02/21 职场文书
《孔繁森》教学反思
2014/04/17 职场文书
电子商务专业求职信
2014/07/10 职场文书
办公室卫生管理制度
2015/08/04 职场文书
中学总务处工作总结
2015/08/12 职场文书
防溺水安全教育主题班会
2015/08/12 职场文书
2019年暑期法院实习报告
2019/12/18 职场文书
游戏开发中如何使用CocosCreator进行音效处理
2021/04/14 Javascript
新手必备之MySQL msi版本下载安装图文详细教程
2021/05/21 MySQL
ECharts transform数据转换和dataZoom在项目中使用
2022/12/24 Javascript