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学习笔记之总体架构
Jun 03 Javascript
Vue.js学习笔记之 helloworld
Aug 14 Javascript
Yarn的安装与使用详细介绍
Oct 25 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
Nov 10 Javascript
vue 2.0组件与v-model详解
Mar 27 Javascript
全面解析vue中的数据双向绑定
May 10 Javascript
手把手搭建安装基于windows的Vue.js运行环境
Jun 12 Javascript
基于Vue生产环境部署详解
Sep 15 Javascript
vue中本地静态图片路径写法
Mar 06 Javascript
webpack v4 从dev到prd的方法
Apr 02 Javascript
Iview Table组件中各种组件扩展的使用
Oct 20 Javascript
Vue实现base64编码图片间的切换功能
Dec 04 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
玩转图像函数库―常见图形操作
2006/09/03 PHP
php实现图片转换成ASCII码的方法
2015/04/03 PHP
js模仿hover的具体实现代码
2013/12/30 Javascript
IE6已终止操作问题的2种情况及解决
2014/04/23 Javascript
javascript中的__defineGetter__和__defineSetter__介绍
2014/08/15 Javascript
一个实用的图片切换支持点击切换和自动轮播
2014/09/09 Javascript
jQuery中prependTo()方法用法实例
2015/01/08 Javascript
介绍一个简单的JavaScript类框架
2015/06/24 Javascript
javascript设计模式之对象工厂函数与构造函数详解
2015/07/30 Javascript
关于javascript的一些知识以及循环详解
2016/09/12 Javascript
概述javascript在Google IE中的调试技巧
2016/11/24 Javascript
使用 Vue.js 仿百度搜索框的实例代码
2017/05/09 Javascript
JavaScript中为事件指定处理程序的五种方式分析
2018/07/27 Javascript
vue+VeeValidate 校验范围实例详解(部分校验,全部校验)
2018/10/19 Javascript
在layui tab控件中载入外部html页面的方法
2019/09/04 Javascript
[02:48]DOTA2超级联赛专访海涛:你们的选择没有错
2013/06/07 DOTA
[01:02:04]EG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.23
2019/09/05 DOTA
[01:01:41]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Magma BO3 第二场 1月31日
2021/03/11 DOTA
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
python学习 流程控制语句详解
2016/06/01 Python
Python获取某一天是星期几的方法示例
2017/01/17 Python
Python上下文管理器和with块详解
2017/09/09 Python
Python解决pip install时出现的Could not fetch URL问题
2019/08/01 Python
django 通过url实现简单的权限控制的例子
2019/08/16 Python
python3实现弹弹球小游戏
2019/11/25 Python
Python字符串hashlib加密模块使用案例
2020/03/10 Python
python读取图像矩阵文件并转换为向量实例
2020/06/18 Python
Python实现画图软件功能方法详解
2020/07/28 Python
Html5实现文件异步上传功能
2017/05/19 HTML / CSS
Under Armour安德玛法国官网:美国高端运动科技品牌
2018/06/29 全球购物
数字天堂软件测试面试题
2012/12/23 面试题
小学生评语大全
2014/04/18 职场文书
超市周年庆活动方案
2014/08/16 职场文书
大学生职业生涯十年规划书范文
2014/09/17 职场文书
2016社区平安家庭事迹材料
2016/02/26 职场文书
python异步的ASGI与Fast Api实现
2021/07/16 Python