可以进行文本框赋值,文本域赋值,下拉列表赋值,单选框赋值,多选框赋值,

传入对象,可以根据元素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根据选择器进行页面赋值,封装赋值方法的更多相关文章

  1. 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式

    查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...

  2. jQuery 互相调用iframe页面中js的方法

    1,子iframe内调用父类函数方法: window.parent.func(); 2,子Iframe中获取父界面的元素: $("#xx", window.parent.docum ...

  3. JQuery调用iframe子页面函数/对象的方法例子

    父页面有个ID为mainfrm.name为Iframe1的iframe,iframe连接b.html,该页面有个函数test 在父页面调用b.html的test方法为: $("#mainfr ...

  4. jQuery属性选择器.attr()和.prop()两种方法

    在判断表单单选框是否被选中时,通常会想到使用$('#checkbox').attr('checked')来判断,但在一些情况下,你会发现这种方法并不管用,得到的是undefined. 原来jQuery ...

  5. JQuery调用iframe子页面函数/对象的方法

    父页面有个ID为mainfrm的iframe,iframe连接b.html,该页面有个函数test 在父页面调用b.html的test方法为: $("#mainfrm")[0].c ...

  6. jquery中选择器的 html() text() val() attr() 方法的区别与使用方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jquery操作select下拉框的多种方法(选中,取值,赋值等)

    Query获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Sel ...

  8. Jquery 关于span标签的取值赋值用法

    span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...

  9. jQuery设计思想之取值和赋值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 互联网基础知识------OSI七层网络模型梗概

    OSI七层模型 七层网络结构: 应用层.表示层.会话层.传输层.网络层.数据链路层.物理层 一般也作五层 应用层.传输层.网络层.数据链路层.物理层(实体层) 引申问题:TCP/IP协议与http协议 ...

  2. Jquery ajax与asp.net MVC前后端各种交互

    1.Jquery通过ajaxSubmit提交表单 if (jQuery("#Edit_from").validate().form()) { jQuery("#Edit_ ...

  3. 微服务架构 ------ 插曲 linux LVM磁盘扩容

    1.LVM的基本概念 物理卷(PV):可以在上面建立卷组的媒介,可以是硬盘分区,也可以是硬盘本身或者回环文件,物理卷包括一个特殊的header,其余部分被切割成一块块物理区域. 卷组(VG):将一组物 ...

  4. 如何在Mac下配置多个Java版本

    使用工具:brew cask brew cask是一个用命令行管理Mac下应用的工具,提供了自动安装和卸载功能,能够自动从官网上下载并安装 最新的版本,它是基于homebrew的一个增强工具. 一. ...

  5. laravel框架之即时更改

    表单//@foreach($res as $k=>$v) <tr id="{{$v->id}}" > <td>{{$v->id}}< ...

  6. SQL Server强制释放内存

    --强制释放内存 CREATE procedure [dbo].ClearMemory as begin --清除所有缓存 DBCC DROPCLEANBUFFERS --打开高级配置 EXEC (' ...

  7. CSSS选择器总结

    title: CSSS选择器总结 date: 2018-07-30 20:11:07 tags: css --- 在css的学习中有一个很容易让人混乱的就是css选择器,因为选择器有很多种,而且在使用 ...

  8. js点击按钮button效果(波效果)

    Material Design风格纯js按钮点击波特效 演示效果 html部分: <button data-ripple> Demo button 6 </button> cs ...

  9. 恭喜你!看到这6个MES系统选型的大坑,千万要避免!

    随着工业4.0概念的出现,智能化生产成为了各大制造业的发展趋势! MES系统可以为企业提供包括制造数据管理.计划排程管理.生产调度管理.库存管理.质量管理.人力资源管理.工作中心/设备管理.工具工装管 ...

  10. QTableWidget表格属性

    ui->tableWidget->setEditTriggers(QAbstractItemView::NoEditTriggers); //设置不可编辑 ui->tableWidg ...