jQuery 获取和设置radio 和 checkbox 值的操作
jquery 中的val(),可以取值也可赋值,表单元素中的radio和checkbox是比较常用的控件,下面说说对它们的取值和赋值的使用
1、取值
表单如下:
<div class="items">
@if (Model.Question.type == "单选")
{
<div><input type="radio" id="A" name="sin" value="A" /><label for="A"><span class="item">A</span>@Model.Question.A</label></div>
<div><input type="radio" id="B" name="sin" value="B" /><label for="B"><span class="item">B</span>@Model.Question.B</label></div>
<div><input type="radio" id="C" name="sin" value="C" /><label for="C"><span class="item">C</span>@Model.Question.C</label></div>
<div><input type="radio" id="D" name="sin" value="D" /><label for="D"><span class="item">D</span>@Model.Question.D</label></div>
}
else if (Model.Question.type == "多选")
{
<div><input type="checkbox" id="A" name="mul" value="A" /><label for="A"><span class="item">A</span>@Model.Question.A</label></div>
<div><input type="checkbox" id="B" name="mul" value="B" /><label for="B"><span class="item">B</span>@Model.Question.B</label></div>
<div><input type="checkbox" id="C" name="mul" value="C" /><label for="C"><span class="item">C</span>@Model.Question.C</label></div>
<div><input type="checkbox" id="D" name="mul" value="D" /><label for="D"><span class="item">D</span>@Model.Question.D</label></div>
}
else
{
<div><input type="radio" id="A" name="jul" value="@Model.Question.A" /><label for="A"><span class="item"></span>@Model.Question.A</label></div>
<div><input type="radio" id="B" name="jul" value="@Model.Question.B" /><label for="B"><span class="item"></span>@Model.Question.B</label></div>
}
</div>
jquery代码:
$(".items input").click(function () {
var answer = "";
if (type == "单选") {
answer = $(":radio[name=sin]:checked").val();
alert(answer);
} else if (type == "多选") {
$(":checkbox[name=mul]:checked").each(function () {
answer += $(this).val() + ",";
});
} else {
answer = $("input:radio[name=jul]:checked").val();
}
$.post("/home/clickItem", { questionId: '@Model.Question.id', userAnswer: answer }, function (data) {
if (data != "ok") {
alert(data);
location.href = "/home/login";
}
});
});
radio 好取,只要取 :checked 选中的值,checkbox 可能是多选,需要循环取值
2、赋值
赋值可不能这样 $(":radio").val("B"),这种是不行的,使用数组的方式赋值,应该这样 $(":radio").val(["B"]) ,$(":checkbox").val(["A","C","D"]),
if (type == "单选") {
$(":radio[name=sin]").val([useranswer]);
} else if (type == "多选") {
var arr = useranswer.substring(, useranswer.length - ).split(","); //useranswer="B,C,D"这种形式转成数组
$(":checkbox[name=mul]").val(arr);
} else {
answer = $(":radio[name=jul]").val([useranswer]);
}
jQuery 获取和设置radio 和 checkbox 值的操作的更多相关文章
- JQuery获取与设置HTML元素的值value
JQuery获取与设置HTML元素的值value 作者:简明现代魔法图书馆 发布时间:2011-07-07 10:16:13 20481 次阅读 服务器君一共花费了13.221 ms进行了6次数据库查 ...
- js / jquery 获取和设置 FCK Editor 的值
开发中遇到 通过 $("#content").val(); 或者 document.getElementById("content"); 并不能获取到 id 为 ...
- jquery】常用的jquery获取表单对象的属性与值
[jquery]常用的jquery获取表单对象的属性与值 1.JQuery的概念 JQuery是一个JavaScript的类库,这个类库集合了很多功能方法,利用类库你可以用一些简单的代码实现一些复杂的 ...
- Jquery获取select选中的文本与值
jquery获取select选择的文本与值获取select :获取select 选中的 text : $("#ddlregtype").find("option:s ...
- jquery获取和设置元素高度宽度
jquery获取和设置元素高度宽度 1.height()/ width() 取得第一个匹配元素当前计算的高度/宽度值(px) height(val)/ width(val) 为每个匹配的元素设置CSS ...
- jquery获取select选择的文本与值
jquery获取select选择的文本与值获取select :获取select 选中的 text : $("#ddlregtype").find("option:s ...
- Jquery获取select option动态添加自定义属性值失效
Jquery获取select option动态添加自定义属性值失效 2014/12/31 11:49:19 中国学网转载 编辑:李强 http://www.xue163.com/588880/3909 ...
- jQuery获取或设置元素的宽度和高度
jQuery获取或设置元素的宽度和高度: 可使用以下3种方法: 1,jQuery width() 和 height() 方法: 2,innerWidth() 和 innerHeight() 方法: 3 ...
- js&jquery 获取select下拉框的值、文本内容、自定义属性
js&jquery 获取select下拉框的值.文本内容.自定义属性 CreationTime--2018年7月2日09点22分 Author:Marydon html <selec ...
随机推荐
- 20155214曾士轩 2016-2017-2 《Java程序设计》第1周学习总结
20155214曾士轩 2006-2007-2 <Java程序设计>第1周学习总结 教材学习内容总结 浏览教材,根据自己的理解每章提出一个问题 1.标准API的架构指的是什么? 2.一个项 ...
- 20155230 实验四《android程序设计》实验报告
20155230 实验四<Android程序设计>实验报告 一.安装Android Stuidio 二.从一个活动启动另一个活动 在启动活动的活动里添加如下语句即可 Intent inte ...
- I/O: std::ios_base::openmode
I/O: std::ios_base::openmode std::ios_base::openmode std::ios_base::in: 打开文件进行读操作,即读取文件中的数据 如果指定路径中 ...
- HTML基本代码教学,第二天
HTML 咱们今天来看一下咱们这HTML能做些什么,例如下图(最低级的小实验) 咱们来看一下图片的最左上角<head> <title></ title></ ...
- ideal快捷键
百度一搜索,发现很多快捷键说明,我但是有些说得不对的,我列出来的这些快捷键,有一部分是需要你百度好久,甚至百度一上午才能搜索出来的,并且戴着老花镜.这样的话,在实际工作者,对于初级程序员来说,成本太高 ...
- 套接口socket编程(Client/Server编程实例)
基本概念 套接口也就是网络中的ID.网络通信,归根到底还是进程间通信(不同计算机上的进程间的通信).在网络中,每一个节点(计算机或路由器)都有一个网络地址,也就是IP地址. IP地址:在网络中唯一标识 ...
- Valgrind 简单用法
有时需要给自己写的小程序做个简单的 benchmark,查看内存使用情况和运行时间.这时可以试试 valgrind. Ubuntu 下安装很简单: sudo apt-get update sudo a ...
- 基于Docker Compose构建的MySQL MHA集群
Docker MySQL MHA 基于Docker 1.13.1之上构建的MySQL MHA Docker Compose Project 可快速启动GTID模式下的MasterHA集群, 主用于My ...
- [T-ARA][Lovey-Dovey]
歌词来源:http://music.163.com/#/song?id=22704426 作曲 : 新沙洞老虎/崔圭成 [作曲 : 新沙洞老虎/崔圭成] [作曲 : 新沙洞老虎/崔圭成] 作词 : 新 ...
- Action Required: Please provide your Tax Identity Information - Amazon Seller Tax Identity Collection
Hello ***, Your selling privileges have been suspended because we have not received required tax i ...