动态修改attr里的多个属性
要点:
1、js将字符串转化为object方法,通过新建函数。
2、通过ajax返回的数据是object类型。
3、jquery.attr()里的attr是object类型
例子:主要实现后台返回的attr里的两个参数,将两个参数直接应用赋值
ajax前端请求:
<html>
<head>
<title>jquery 同时修改两个属性</title>
</head> </html> <script src="extlib/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="extlib/JSON-js-master/json_parse.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
/*** json 格式字符串转化为 javascript object ***/ function parseObj( strData ){ return (new Function( "return " + strData ))(); } $.ajax({
url: 'retJson.php',
type: 'POST',
dataType: 'json',
data: {param1: 'value1'},
success:function(data)
{ /**
* [imgAttr ajax接收到的data是object对象]
* @type {[object]}
*/
imgAttrStr = data['img']; /**
* 将object 转化为json字符串
* [str 将object解析json字符串]
* @type {[string]}
*/
var str = JSON.stringify(data);
alert(str); /**
* 将json字符串转化object
* [object parseJSON与eval("("+str+")")]等价
* @type {[object]}
* object
*/
var jsonObject = $.parseJSON(str);
var jsonObject = eval("("+str+")"); /**
* [imgAttr 将“字符串”转化对象,修改attr属性]
* $("#").attr(object)
* @type {[object]}
*/
imgAttrObject = parseObj(imgAttrStr);
// alert(typeof(imgAttr)); $("#img_switch").attr(imgAttrObject); }
}); </script> <body> <div>
<img id="img_switch" src="data:images/ups_ac_fail.gif" height="216" width="450" alt="UPS断线">
</div> </body>
php后台数据返回
<?php
echo "{\"img\":\"{'src':'images/ups_online.gif','alt':'UPS在线'}\" }";
// echo '{"img":"images/ups_online.gif"}';
?>
动态修改attr里的多个属性的更多相关文章
- JavaScript动态修改html组件form的action属性
用javaScript动态修改html组件form的action属性,可以在提交时再决定处理表单的页面. <%--JavaScript部分--%><script language=& ...
- 周记5——随机撒花特效、动态修改伪元素样式、contenteditable属性、手机端调试利器VConsole、浏览器端debug调试
记录一些小零碎知识点,以便日后查看~ 1.随机撒花特效 教师节快到了,公司的产品提出一个需求:在IM(即时聊天)聊天界面弹出教师节的祝福“广告”,用户点击“发送祝福”按钮,聊天界面会随机撒花.这里的重 ...
- 自己动手丰衣足食之轮播图一动态修改marginTop属性实现轮播图
引言 学习jQuery有年头了,刚开始学习时自己动手写过轮播图,放的久了以至于忘了大致思路了.现在转而做前端,抽空把jquery轮播图拿出来写一写,把各种思路都自己练习练习,这里主要使用动态修改mar ...
- JDK动态代理+反射实现动态修改注解属性值
这是最近朋友的一个需求,正好闲来无聊有些时间,跟着研究一下,如有不正确的地方,欢迎大家指正~ 一.准备自定义注解 注:如何实现自定义注解,请移步百度. 二.实现 1.实现方式1:通过反射+动态代理动态 ...
- Day14_85_通过反射机制修改Class的属性值(IO+Properties)动态修改
通过反射机制修改Class的属性值(IO+Properties)动态修改 import java.io.FileInputStream; import java.io.FileNotFoundExce ...
- [SAP ABAP开发技术总结]动态修改选择屏幕
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- 动态修改 NodeJS 程序中的变量值
如果一个 NodeJS 进程正在运行,有办法修改程序中的变量值么?答案是:通过 V8 的 Debugger 接口可以!本文将详细介绍实现步骤. 启动一个 HTTP Server 用简单的 Hello ...
- 动态修改 C 语言函数的实现
Objective-C 作为基于 Runtime 的语言,它有非常强大的动态特性,可以在运行期间自省.进行方法调剂.为类增加属性.修改消息转发链路,在代码运行期间通过 Runtime 几乎可以修改 O ...
- 关于360插件化Replugin Activity动态修改父类的字节码操作
近期在接入360插件化方案Replugin时,发现出现崩溃情况. 大概崩溃内容如下: aused by: java.lang.ClassNotFoundException: Didn't find c ...
随机推荐
- 第六次作业——利用MFC实现计算器图形界面以及简单四则运算表达式批处理
参考资料: 1.MFC响应键盘 2.计算器实例 3.MFC文件对话框 4.MFCUpdateData()函数的使用 5.MFC教程 6.wi ...
- FZU 2191 完美的数字
题目链接: 传送门 完美的数字 Time Limit: 1000MS Memory Limit: 65536K 题目描述 Bob是个很喜欢数字的孩子,现在他正在研究一个与数字相关的题目,我们知 ...
- django入门记录 1
步骤: 1 安装python和django 2 创建项目python-admin startproject mysite(此处可以替换) 3 至少需要一个数据表,所以要创建一个表 python ...
- BZOJ3224 普通平衡树
传送门: Treap 版本: //OJ 1999 //by Cydiater //2016.8.30 #include <iostream> #include <cstdio> ...
- zoj 3946 Highway Project(最短路 + 优先队列)
Highway Project Time Limit: 2 Seconds Memory Limit: 65536 KB Edward, the emperor of the Marjar ...
- mybatis的批量删除
公司工程用的是Mybatis的example的类,自动生成了对数据库的操作,批量操作的今天用到了,两种方式,一种需要拓展它生成的类,另一种自带的. 批量删除的id是以集合List传递 id以List& ...
- “我是谁?”-管理者的角色、职责与工作思路.ppt
http://doc.mbalib.com/view/95b6a675adeaf38a2c028bd4f53f0bf6.html 管理者的三大工作重心: 任务(目标).团队.规划.
- java8 中的时间和数据的变化
java8除了lambda表达式之外还对时间和数组这两块常用API做想应调整, Stream 有几个常用函数: store 排序 (a,b)-> a.compareTo(b) 排出来的结果是正 ...
- Java 性能优化技巧集锦
摘要: =================================== 可供程序利用的资源(内存.CPU时间.网络带宽等)是有限的,优化的目的就是让程序用尽可能少的资源完成预定的任务.优化通常 ...
- HTML学习笔记——列表和table
1>有序列表.无序列表和自定义列表 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu ...