关于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" />

时间: 2024-07-30 22:38:10

关于js开发的小问题的相关文章

MPVUE - 使用vue.js开发微信小程序

MPVUE - 使用vue.js开发微信小程序 什么是mpvue? mpvue 是美团点评前端团队开源的一款使用 Vue.js 开发微信小程序的前端框架.框架提供了完整的 Vue.js 开发体验,开发者编写 Vue.js 代码,mpvue 将其解析转换为小程序并确保其正确运行. 简单上手mpvue 官方提供了一套quickstart模板. vue init mpvue/mpvue-quickstart my-project 安装好依赖之后,执行npm run dev,将会将小程序文件打包进dis

《Node入门》读书笔记——用Node.js开发一个小应用

如需转载请注明出处 http://blog.csdn.net/as645788 Android APP的开发告一段落,一个稳定的.实现了基本功能的APP已经交付用户使用了!我和老板交流了下,接下来准备转战Node.js了,而且一部分前端的功能也要做进去!哈哈哈~~~接下来要朝一个全(zuo)栈(si)工程师进发了,想想都有点小激动呢!这几天一直在学新东西,HTML CSS JavaScript jQuery SQL bootstrap Node.js ··········· (好吧,看着这么多前

JS开发页面小组件:table组件

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> table{ border: solid 1px black; } #container td{ border: solid 1px black; } </style> </head> &

纯正商业级应用-Node.js Koa2开发微信小程序服务端

第1章 前言.导学与node.js如何理解Node.js?前端到底要不要学习Node.js?本课程能让你学到什么? 第2章 Koa2的那点事儿与异步编程模型Koa非常的精简,基本上,没有经过二次开发的Koa根本“不能”用.本章我们讲解Koa的重要特性,理解什么是洋葱模型?以及在KOA中如何进行异步编程?很多同学都了解以上知识点,但听完本章,你会有一些不一样的理解,比如:为什么要有洋葱模型?没有会怎样?Koa中间件一定是异步的吗? ... 第3章 路由系统的改造Koa-router需要进行一些改造

推荐近期15个 Node.js 开发工具

近来Node.js 越来月流行了,这个基于Google V8 引擎建立的平台, 用于方便地搭建响应速度快.易于扩展的网络应用.在本文中,我们列出了2015年最佳的15个 Node.js 开发工具.这些工具对于刚刚开始学习 Node.js 的新手开发者非常有帮助.如果你知道任何其他有用的 Node.js 资源,请让我们知道. 1. IO.js JavaScript的I / O是一个NPM兼容的平台,最初是基于Node.js和建立在Chrome V8运行.它的目的是提供更快和可预测的发布周期. 2.

【读书笔记】Node.js开发指南

一:Node.js是什么? 正如当年为了统一 JavaScript 语言标准,人们制定了 ECMAScript 规范一样,如今为了统一 JavaScript 在浏览器之外的实现, CommonJS 诞生了. CommonJS 试图定义一套普通应用程序使用的API,从而填补 JavaScript 标准库过于简单的不足. CommonJS 的终极目标是制定一个像 C++ 标准库一样的规范,使得基于 CommonJS API 的应用程序可以在不同的环下运行,就像用 C++ 编写的应用程序可以使用不同的

17、Cocos2dx 3.0游戏开发找小三之内置的常用层:三剑客LayerColor、LayerGradient、Menu

重开发者的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/30477587 为了方便游戏开发者,Cocos2d-x 内置了 3 种特殊的 Layer: 具体如下所示: LayerColor:一个单纯的实心色块. LayerGradient:一个色块,但可以设置两种颜色的渐变效果. Menu:十分常用的游戏菜单. LayerColor 与 与 LayerGradient 这两个层十分简单,都仅仅包含一个色块. 不同

利用WordPress REST API 开发微信小程序从入门到放弃

自从我发布并开源WordPress版微信小程序以来,很多WordPress网站的站长问有关程序开发的问题,其实在文章:<用微信小程序连接WordPress网站>讲述过一些基本的要点,不过仍然有不少人对一些细节不明白,于是我就想着再写一篇比较全面而基础的教程,主要针对入门级别用户,高手就不用看了. WordPress版“守望轩”微信小程序开放源码地址:https://github.com/iamxjb/winxin-app-watch-life.net 至于标题,请原谅我,我标题党了. Word

[转载]Sublime Text 3 搭建 React.js 开发环境

[转载]Sublime Text 3 搭建 React.js 开发环境 Sublime有很强的自定义功能,插件库很庞大,针对新语言插件更新很快,配合使用可以快速搭建适配语言的开发环境. 1. babel-sublime 支持ES6, React.js, jsx代码高亮,对 JavaScript, jQuery 也有很好的扩展.关于 babel 的更多介绍可以看这里:为什么说Babel将推动JavaScript的发展 安装 PC:Ctrl+shift+p Mac:Cmd+shift+p 打开面板输