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

  • 相关阅读:
    gitblit 配置图文详解
    springmvc文件下载之文件名下划线问题终极解决方案
    redis实战进阶
    关于B+树, 你要了解的都在这里
    http的长连接和短连接(史上最通俗!)以及应用场景
    Base64的前世今生
    Springfox集成Swagger2实战篇
    Minio使用详解
    ubuntu系统五笔输入法安装
    YouTube排名第一的励志英文演讲《Dream(梦想)》
  • 原文地址:https://www.cnblogs.com/tianboblog/p/5655765.html
Copyright © 2020-2023  润新知