zoukankan      html  css  js  c++  java
  • $.data(data , "")

    今天在二次开发的时候,看到源代码的新闻列表是Aajax获取的,点击新闻内容触发编辑,我没有看到新闻Id却能查到信息。

    观看$.ajax遍历赋值过程中,$tr("<a>新闻内容</a>").data("data" , obj)绑定了此条新闻的JSOn数据,在编辑时候只要$.data("data") 就能获取到此数组

    1.$data的基本语法

       data([key],[value])     

    在元素上存放或读取数据,返回jQuery对象。

    当参数只有一个key的时候,为读取该jQuery对象对应DOM中存储的key对应的值,值得注意的是,如果浏览器支持HTML5,同样可以读取该DOM中使用 data-[key] = [value] 所存储的值。参见最后一个示例。

    当参数为两个时,为像该jQuery对象对应的DOM中存储key-value键值对的数据。

    如果jQuery集合指向多个元素,那将在所有元素上设置对应数据。 这个函数不用建立一个新的expando,就能在一个元素上存放任何格式的数据,而不仅仅是字符串。

    V1.4.3 新增用法, data(obj) 可传入key-value形式的数据。

    2.$.data的实例子

    2.1

    在一个DIV上存放数据:<div><div>

    Jquery代码;

    $("div").data("blah");  // undefined
    $("div").data("blah", "hello");  // blah设置为hello
    $("div").data("blah");  // hello
    $("div").data("blah", 86);  // 设置为86
    $("div").data("blah");  //  86
    $("div").removeData("blah");  //移除blah
    $("div").data("blah");  // undefined

    2.2

    在一个div上存取名/值对数据:<div><div>

    Jquery代码;

    $("div").data("test", { first: 16, last: "pizza!" });
    $("div").data("test").first  //16;
    $("div").data("test").last  //pizza!;

    3.我见过的

    赋值:

                            $.each(data, function (n, obj) {
                               console.log(obj);
                                if (currentStatus == "mReg") {
                                    //   fillReg(obj);
                                    $("#task-table").append("<tr class='mReg'><th></th><th>" + obj.t.time + "</th><th colspan='3'>" + obj.t.rate + "%</th><th colspan='2'>" + obj.t.worktime + " </th></tr>");
                                    $.each(obj.lt, function (n, data) {
                                       // console.log(data);
                                        var tr = $("<tr><th>" + (n + 1) + "</th><th ><a href='#' onclick='editTask(this)'> " + data.content + "</a></th><th>" + data.rate + "</th><th> " + data.project + "</th><th> " + data.category + "</th><th>" + data.worktime + "</th><th>" + data.endTimeSta + "</th></tr>");
                                       
                                        tr.find("a").data("data", data);  //------------重点
                                        $("#task-table").append(tr);
    
                                    })
                                }
                                else
                                {
                                    fillCou(obj);
                                }
    
                            });

    编辑:

            var editTask = function(sender) {
                var obj = $(sender).data("data");
                //获取任务信息
                currentId = obj.id;
                $('#content').val(obj.content);
                $('#project').val(obj.project);
                $('#category').val(obj.category);
                $("#worktime").val(obj.worktime);
                $("#endtime").val(obj.endtime);
                $("#rateO").val(obj.rate);
                $("#rateO").text(obj.rate+"%");
                     }
  • 相关阅读:
    redis缓存问题解决方案
    JVM 2-垃圾收集及内存分配策略
    JVM 1-内存管理
    mysql数据库基础
    事务学习
    使用redis分布式锁来解决集群项目的定时任务冲突问题
    Spring AOP学习
    Spring IOC
    java语言基础7--线程相关类
    多重背包的二进制优化——DP
  • 原文地址:https://www.cnblogs.com/0to9/p/5722208.html
Copyright © 2011-2022 走看看