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 相关文章推荐
jQuery 遍历json数组的实现代码
Sep 22 Javascript
jquery.artwl.thickbox.js  一个非常简单好用的jQuery弹出层插件
Mar 01 Javascript
浅谈Javascript事件对象
Feb 05 Javascript
JavaScript函数节流和函数防抖之间的区别
Feb 15 Javascript
将angular.js项目整合到.net mvc中的方法详解
Jun 29 Javascript
Angular 1.x个人使用的经验小结
Jul 19 Javascript
vue 运用mock数据的示例代码
Nov 07 Javascript
vue-router 手势滑动触发返回功能
Sep 30 Javascript
纯javascript实现选择框的全选与反选功能
Apr 08 Javascript
fastadmin中调用js的方法
May 14 Javascript
解决vue单页面 回退页面 keeplive 缓存问题
Jul 22 Javascript
js 数组 fill() 填充方法
Nov 02 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文章内容分页并生成相应的htm静态页面代码
2010/06/07 PHP
php更新mysql后获取影响的行数发生异常解决方法
2013/03/28 PHP
php读取excel文件示例分享(更新修改excel)
2014/02/27 PHP
PHP中把stdClass Object转array的几个方法
2014/05/08 PHP
PHP单例模式与工厂模式详解
2017/08/29 PHP
PHP实现合并两个排序链表的方法
2018/01/19 PHP
PHP crc32()函数讲解
2019/02/14 PHP
Javascript客户端脚本的设计和应用
2006/08/21 Javascript
获取页面高度,窗口高度,滚动条高度等参数值getPageSize,getPageScroll
2006/09/22 Javascript
JS获取整个页面文档的实现代码
2011/12/15 Javascript
JQuery设置文本框和密码框得到焦点时的样式
2013/08/30 Javascript
jquery根据属性和index来查找属性值并操作
2014/07/25 Javascript
javascript运动效果实例总结(放大缩小、滑动淡入、滚动)
2016/01/08 Javascript
Bootstrap 网站实例之单页营销网站
2016/10/20 Javascript
JS中的phototype详解
2017/02/04 Javascript
JavaScript初学者必看“new”
2017/06/12 Javascript
详谈AngularJs 控制器、数据绑定、作用域
2017/07/09 Javascript
JavaScript定时器setTimeout()和setInterval()详解
2017/08/18 Javascript
Gulp实现静态网页模块化的方法详解
2018/01/09 Javascript
vue实现一拉到底的滑动验证
2019/07/25 Javascript
nodejs脚本centos开机启动实操方法
2020/03/04 NodeJs
vue 百度地图(vue-baidu-map)绘制方向箭头折线实例代码详解
2020/04/28 Javascript
JavaScript 实现轮播图特效的示例
2020/11/05 Javascript
[45:17]DOTA2-DPC中国联赛定级赛 Phoenix vs DLG BO3第三场 1月9日
2021/03/11 DOTA
[48:48]完美世界DOTA2联赛PWL S3 Magama vs GXR 第一场 12.19
2020/12/24 DOTA
python实现字符串和日期相互转换的方法
2015/05/13 Python
Python学习笔记之函数的定义和作用域实例详解
2019/08/13 Python
Python3 用什么IDE开发工具比较好
2020/11/28 Python
AmazeUI 列表的实现示例
2020/08/17 HTML / CSS
NBA欧洲商店(英国):NBA Europe Store UK
2018/07/27 全球购物
急诊科护士自我鉴定
2013/10/14 职场文书
质检的岗位职责
2013/11/17 职场文书
水电工岗位职责
2014/02/12 职场文书
禁止酒驾标语
2014/06/25 职场文书
艾滋病宣传标语
2014/06/25 职场文书
教育合作协议范本
2014/10/17 职场文书