关于js开发的小问题
一、开发当中经常会动态拼接html,当然为了简便性好多人直接就是使用内联事件:
$('#td1').html( '<a href="#" onclick="app.showPostEdit('+aData+')"></a>');
$.Test = {
GetData: function () {
$.post("/Home/GetData", function (backdata) {
var strHtml = "";
$.each(backdata, function (itemIndex, item) {
strHtml += "<div class=\"row\">";
strHtml += " <div class=\"col-md-4\">";
strHtml += " " + item.Id;
strHtml += " </div>";
strHtml += " <div class=\"col-md-4\">";
strHtml += " " + item.Url;
strHtml += " </div>";
strHtml += " <div class=\"col-md-4\">";
strHtml += " <button class=\"btn btn-sm\" onclick=\"$.Test.AppendBtn(" + item + ")\">" + item.Name + "</button>";
strHtml += " </div>";
strHtml += "</div>";
});
$("#content").append(strHtml);
});
},
AppendBtn: function (str) {
console.log(str);
alert(str.Name);
}
};
浏览器会把它解析为:
<button class="btn btn-sm" onclick="$.Test.AppendBtn(eval([object Object]))">Name1</button>
毫无疑问,上面这种情况肯定是不对的;通常这种解决方案有两种:
1、使用全局变量,函数中传递对象索引,在具体的函数根据索引取出相应的对象
2、不使用内联事件,动态注册事件
当然还有一种方法,就是把对象的属性分别取出来进行传递;如果只有一两个还可以,否则.........你懂的!如果有更好的解决方案,请指教,多谢哦!
二、当业务比较复杂,一个页面中可能要写多个js文件,某个js文件可能使用common.js中的方法,而真正去写代码时会发现没有提示;
只需要把common.js拖到你当前的js文件中即可;
你的js文件会出现:/// <reference path="common.js" />
关于js开发的小问题的更多相关文章
- 用Vue.js开发微信小程序:开源框架mpvue解析
前言 mpvue 是一款使用 Vue.js 开发微信小程序的前端框架.使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力.如果想将 H5 项目改造为小程 ...
- 【转】利用 three.js 开发微信小游戏的尝试
前言 这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各 ...
- MPVUE - 使用vue.js开发微信小程序
MPVUE - 使用vue.js开发微信小程序 什么是mpvue? mpvue 是美团点评前端团队开源的一款使用 Vue.js 开发微信小程序的前端框架.框架提供了完整的 Vue.js 开发体验,开发 ...
- 《Node入门》读书笔记——用Node.js开发一个小应用
Android APP的开发告一段落,一个稳定的.实现了基本功能的APP已经交付用户使用了!我和老板交流了下,接下来准备转战Node.js了,而且一部分前端的功能也要做进去!哈哈哈~~~接下来要朝一个 ...
- 尝试用Vue.js开发网页小游戏的过程
准备 首先去官方下载并安装VSCODE,下载地址 https://code.visualstudio.com/.安装后打开会发现是英文版的,需要去安装插件来汉化.具体是在扩展插件搜索chinese,选 ...
- JS开发页面小组件:table组件
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- node.js 开发简易的小爬虫
node.js 开发简易的小爬虫 最近公司开发一款医药类的软件,所以需要一些药品的基础数据,所以本人就用node.js写一个简易的小爬虫,并写记录这个Demo以供大家参考. 一.开发前的准备: 1, ...
- 支付宝小程序室内地图导航开发-支付宝小程序JS加载esmap地图
如果是微信小程序开发,请参考微信小程序室内地图导航开发-微信小程序JS加载esmap地图文章 一.在支付宝小程序里显示室内三维地图 需要满足的两个条件 调用ESMap室内地图需要用到小程序web-vi ...
- 从微信小程序到鸿蒙js开发【11】——页面路由
目录: 1.router.push()&wx.navigateTo() 2.router.replace()&wx.redirectTo() 3.router.back()&w ...
随机推荐
- 【CF645D】 Robot Rapping Results Report(拓扑排序,二分)
题意:有一张N点M边的有向图,求最小的K使根据前K条边就能够确定图是否有唯一的拓扑序, 若没有唯一拓扑序输出-1 思路:二分答案再拓扑排序,以入度为0的节点作为新的一层,若某一层的节点个数<&g ...
- 转 Python——UnicodeEncodeError: 'ascii' codec can't encode/decode characters
转自: http://blog.csdn.net/zuyi532/article/details/8851316 我是写爬虫的时候遇到的问题,百度了一下,先贴解决方案: 在代码中加入: import ...
- 标准C程序设计七---121
Linux应用 编程深入 语言编程 标准C程序设计七---经典C11程序设计 以下内容为阅读: <标准C程序设计>(第7版) 作者 ...
- 标准C程序设计七---60
Linux应用 编程深入 语言编程 标准C程序设计七---经典C11程序设计 以下内容为阅读: <标准C程序设计>(第7版) 作者 ...
- LeetCode OJ--Permutations II
给的一个数列中,可能存在重复的数,比如 1 1 2 ,求其全排列. 记录上一个得出来的排列,看这个排列和上一个是否相同. #include <iostream> #include < ...
- 天梯赛 - L2-002 链表去重
GG思密达,第二个测试点的三分怎么也拿不上,我还是比较熟悉指针,用指针来写~,写完去上概率论 题目链接:https://www.patest.cn/contests/gplt/L2-002 #incl ...
- ubuntu网络、包管理、工作内容小结
中国地图 1.配置IP cat /etc/network/interfaces auto lo iface lo inet loopback # The loopback network interf ...
- awk数组详解、实战
1.其它编程语言数组的下标一般从0开始,awk中数组下标默认从1开始,也可以从0开始设置: awk 'BEGIN{huluwa[0]="大娃";huluwa[1]="二娃 ...
- AC自动机(加强版)
题目描述 有NN个由小写字母组成的模式串以及一个文本串TT.每个模式串可能会在文本串中出现多次.你需要找出哪些模式串在文本串TT中出现的次数最多. 输入输出格式 输入格式: 输入含多组数据. 每组数据 ...
- Maven转换成Eclipse/Idea/MyEclipse工程,以及配置Web工程
Eclipse/MyEclipse: //Jar mvn eclipse:eclipse mvn eclipse:myeclipse //Web mvn eclipse:eclipse -Dwtpve ...