今天讲了Jquery里面JSON的用法，下面是今天讲课给的例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title></title>

        <script src="jquery-1.11.2.min.js"></script>

    </head>

        <div id="aa" style="width: 100px; height: 100px; background-color: #F93;">hello</div>

        <input type="text" id="bd" />

        <input type="button" id="btn1" value="挂事件" />

        <input type="button" id="btn2" value="移除事件" />

    </body>

    <script type="text/javascript">

        //静态加事件

        //$("#aa").click(function(){})

        //挂事件（动态绑定事件）

        $("#btn1").click(function(){

            //给DIV绑定事件

            $("#aa").bind("click",function(){

                alert("div点击了");

            });

        })

        //移除事件

        $("#btn2").click(function(){

            $("#aa").unbind("click");

        })

        //事件数据

        //事件源

        $("#aa").keydown(function(e){

            alert(e.keyCode);

        })

        //JSON

        //$arr = array("one"=>"111")

        var j = {

            "one":"111111",

            "two":"222222",

            "three":"333333",

            "four":{"aa":"444111"}

        };

        //alert(j["two"]);//数组的取之方法

        //alert(j.two);//点语法

        //alert(j.four.aa);

        //遍历

        for(var k in j)

        {

            alert(j[k]);

        }

    </script>

</html>

我们可以看到事件包括事件源和事件数据，在JSON里面如果要添加数据的话，需要接受一个变量，然后在花括号里面输上索引值和数据内容，中间用引号相连接，上面的代码用红色标记部分就是JSON的代码部分；

给标签加挂事件和移除事件的部分在上述代码也用褐色标记出来了，我们可以看到用Jquery方法非常的简单和方便，他不像静态事件一样，无法移除。这样大大的增加了事件的实用性。

这就是上述代码最终的显示结果，之后会把JSON里面的内容都一一显示出来，JSON里面可以存储任何形式的数据！！！

Jquery之JSON的用法的更多相关文章

  1. jquery下json数组的操作用法实例

    jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...

  2. JSON基本用法

    JSON基本用法 2016-08-10 16:42:19   JSON的全称是“JavaScript Object Notation”,意思是JavaScript对象表示法,它是一种基于文本,独立于语 ...

  3. [转] jQuery 操作 JSON 数据

    jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...

  4. jquery get ($.get) 事件用法与分析

    jquery get ($.get) 事件用法与分析 get() 方法通过远程 HTTP GET 请求载入信息.这是一个简单的 GET 请求功能以取代复杂 $.ajax .请求成功时可调用回调函数.如 ...

  5. jQuery中Animate进阶用法（一）

    jQuery中animate的用法你了解多少呢?如果仅仅是简单的移动位置,显示隐藏,哦!天哪你在浪费资源!因为animate太强大了,你可以有很多意想不到的用法!让我们一起研究一下吧~~ 首先要了解j ...

  6. jQuery中eq()方法用法实例

    本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...

  7. 再谈Newtonsoft.Json高级用法

    上一篇Newtonsoft.Json高级用法发布以后收到挺多回复的,本篇将分享几点挺有用的知识点和最近项目中用到的一个新点进行说明,做为对上篇文章的补充. 阅读目录 动态改变属性序列化名称 枚举值序列 ...

  8. jQuery对json快速赋值

    jQuery对json快速赋值,重点在于将input的id取跟JSON同样的名称. <!DOCTYPE html> <html> <head lang="en& ...

  9. jQuery中$.fn的用法示例介绍

    $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效,下面有个不错的示例,喜欢的朋友可以参考下 如扩展$.fn.abc(),即$.fn.abc()是对jquery ...

随机推荐

  1. Zepto.js-事件处理

    http://www.webdevs.cn/article/68.html     web开发网 事件 $.Event $.Event(type, [properties]) ⇒ event 创建并初 ...

  2. .net 设置版本号信息

    1.AssemblyInfo.cs [assembly: AssemblyVersion("1.3.170116")] [assembly: AssemblyFileVersion ...

  3. A窗口消失B窗口弹出

    一.设计窗口 1) file---new--Application,新建一个窗体,设置该窗体的属性:Caption==登录窗口 2) procedure TForm1.btn1Click(Sender ...

  4. fork() && fork() || fork()

    http://blog.csdn.net/hs794502825/article/details/10242091 #include <unistd.h> #include <std ...

  5. js模块化开发——require.js的用法详细介绍(含jsonp)

    RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签脚本加载步骤.可以用它回事.优化代码,但其主要的目的还是为了代码的模块化.它鼓励在使用脚本以moudle ...

  6. MonthCalendar控件

    MonthCalendar控件  功能,直接显示月历,

  7. C# Linq to SQL — Group by

    需求是需要统计数据库中表某一列的总数量,同时以List的形式返回到UI层. Linq to SQL中的Group by用法如下: IList<Unit.HandleCountClass> ...

  8. 在ASP.NET MVC3项目中，自定义404错误页面

    在Web开发中,用户体验是至关重要的,一个友好的网站自然少不了自定义404错误页面. 让笔者为大家介绍404错误页面在ASP.NET MVC3项目中的配置: 第一步,在项目的Web.config文件中 ...

  9. Adobe Flash Builder 4.7 新功能详解

    Adobe Flash Builder 4.7 Beta终于公开测试了.虽然版本号只增加了.1,增强的新功能可是一点也不含糊.我们一起来看看到底有什么新功能吧!   在我看来,最大的改变是终于提供64 ...

  10. HDU2579

    Dating with girls(2) Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...