jquery根据选择器进行页面赋值,封装赋值方法
可以进行文本框赋值,文本域赋值,下拉列表赋值,单选框赋值,多选框赋值,
传入对象,可以根据元素name进行比对赋值,不用每个进行单独赋值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>springboot</title>
<script type="text/javascript" src="../js/jquery.min.js"></script>
</head>
<body> <div id="test">
<input type="text" name="a"/> <input name="b" value="1" type="radio"/>
<input name="b" value="2" type="radio"/>
<input name="b" value="3" type="radio"/> <input name="c" type="checkbox" value="1"/>
<input name="c" type="checkbox" value="2"/>
<input name="c" type="checkbox" value="3"/> <textarea name="d"></textarea> <select name="e">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div> <script> let data={
a:"123",
b:"2",
c:['1','2'],
d:"1236",
e:"2"
} test2("#test",data);
function test2(args,data){
$(args+" input[type='text']").each(function () {
let tags= $(this).attr("name");
let val=data[tags];
$("input[name="+tags+"]").val(val);
}) $(args+" input[type='radio']").each(function () {
let tags= $(this).attr("name");
let val=data[tags];
$("input[name="+tags+"]").each(function () {
let val2=$(this).val()
if(val==val2){
$(this).prop( "checked",true);
}
})
}) $(args+" input[type='checkbox']").each(function () {
let tags= $(this).attr("name");
let val=data[tags];
console.log(val);
$("input[name="+tags+"]").each(function () {
let val2=$(this).val();
if(val.indexOf(val2)>=0){
$(this).attr("checked",true);
}
})
}) $(args+" textarea").each(function () {
let tags= $(this).attr("name");
let val=data[tags];
$("textarea[name="+tags+"]").val(val);
})
$(args+" select").each(function () {
let tags= $(this).attr("name");
let val=data[tags];
$("select[name="+tags+"]").val(val);
}) } </script>
</body>
</html>
jquery根据选择器进行页面赋值,封装赋值方法的更多相关文章
- 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式
查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...
- jQuery 互相调用iframe页面中js的方法
1,子iframe内调用父类函数方法: window.parent.func(); 2,子Iframe中获取父界面的元素: $("#xx", window.parent.docum ...
- JQuery调用iframe子页面函数/对象的方法例子
父页面有个ID为mainfrm.name为Iframe1的iframe,iframe连接b.html,该页面有个函数test 在父页面调用b.html的test方法为: $("#mainfr ...
- jQuery属性选择器.attr()和.prop()两种方法
在判断表单单选框是否被选中时,通常会想到使用$('#checkbox').attr('checked')来判断,但在一些情况下,你会发现这种方法并不管用,得到的是undefined. 原来jQuery ...
- JQuery调用iframe子页面函数/对象的方法
父页面有个ID为mainfrm的iframe,iframe连接b.html,该页面有个函数test 在父页面调用b.html的test方法为: $("#mainfrm")[0].c ...
- jquery中选择器的 html() text() val() attr() 方法的区别与使用方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery操作select下拉框的多种方法(选中,取值,赋值等)
Query获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Sel ...
- Jquery 关于span标签的取值赋值用法
span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...
- jQuery设计思想之取值和赋值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- USE11 上oracle11导入数据中文乱码
分类专栏: 数据库 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/suqimm/artic ...
- Vue-员工管理系统
大二暑假进行了两周Vue的入门学习,主要内容就是关于前端的入门学习,在两周内学习了Vue的一些简单使用 主要就是使用数据的双向绑定,使用Vue进行数据处理,使用Bootstrap进行布局搭建,下面是我 ...
- layui 动态表格设置单元格样式
col.push({ field: , templet: function (d) { ") { return '<span style="color:white;backg ...
- NetCoreApi框架搭建三、AutoFac 依赖入注)
这里不多做理论上的解释,因为我感觉自己也不是很完全的理解,所以只是记录我自己做的过程. 首先还是粘贴大神的链接:https://www.cnblogs.com/RayWang/p/11165509.h ...
- 【原创】闲来无事,用Winform写了个简易浏览器
核心是利用了winform自带的WebBrowser控件,修改了下IE内核的版本,目前还是单线程的,逻辑挺简单的,萌新都能看懂. 废话不多说,上代码,附打包project. 链接:https://pa ...
- 阿里云监控RDS
RDS性能监控API https://help.aliyun.com/document_detail/26280.html?spm=a2c4g.11186623.6.1576.341d7159uzLD ...
- C++贪心算法实现活动安排问题
问题描述: 设有n个活动的集合E={1,2,…,n},其中,每个活动都要求使用同一资源,而在同一时间内只有一个活动能使用这一资源.每个活动i都有一个要求使用该资源的起始时间si和一个结束时间fi,且s ...
- Java内存泄漏解析!
前言: 内存管理是Java最重要的优势之一,你只需创建对象,Java垃圾收集器会自动负责分配和释放内存.但是,情况并不那么简单,因为在Java应用程序中经常发生内存泄漏. 本章会说明什么是内存泄漏,为 ...
- 隐马尔科夫模型(Hidden Markov Models) 系列之二
转自:http://blog.csdn.net/eaglex/article/details/6385204 隐含模式(Hidden Patterns) 当马尔科夫过程不够强大的时候,我们又该怎么办呢 ...
- rocketmq 使用中碰到的一些问题
1.rocket 入门使用 http://rocketmq.apache.org/docs/quick-start/ 2.内存不够 默认配置内存配置比较高,在测试环境启动会有问题因此需要调整默认的内存 ...