引用

jQuery 是一个 JavaScript 库，不需要安装，直接引用就行

    <!-- jQuery -->

    <script src="/static/vendors/jquery/dist/jquery.min.js"></script>

　　

语法

$(selector).action()

#$定义jquery

#selector是html元素选择器

#action()对元素执行操作

　　

文档就绪事件

$(document).ready(function(){

   // 开始写 jQuery 代码...

});

或者

$(function(){

   // 开始写 jQuery 代码...

});

有多个函数时：

$(function () {

    datatable_func()

    access_key();

    flush_key();

    delete_key();

});

#防止在DOM加载完之前就执行jquery代码

#一般在写jquery时，先上一个$(function (){}把所有函数放进去，然后下面再写函数

　　

点击响应事件

<body>

    <p id="test1">这是一个段落。</p>

    <p id="test2">这是另外一个段落。</p>

    <p>输入框: <input type="text" id="test3" value="this is jQuery"></p>

    <button id="btn1">设置文本</button>

    <button id="btn2">设置 HTML</button>

    <button id="btn3">设置值</button>

    <!-- jQuery -->

    <script src="/static/vendors/jquery/dist/jquery.min.js"></script>

    <script>

        $(function () {

            myFunction()

        });

        function myFunction()

        {

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

                $("#test1").text('<h3>hello jQuery</h3>');

            });

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

                $("#test2").html('<h3>hello jQuery</h3>');

            });

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

                $("#test3").val('hello jQuery');

            });

        }

    </script>

</body>

#text() - 设置或返回所选元素的文本内容

#html() - 设置或返回所选元素的内容（包括 HTML 标记）

#val() - 设置或返回表单字段的值

　　

Ajax

function flush_key()

{

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

        $.ajax({

            url:"{% url 'salt_key_update' %}",

            success: function (arg) {

                if(arg){

                    window.location.href = "{% url 'salt_key_list' %}";

                }

            }

        });

    });

}

#在salt_key_list页面

#由id=flush_status的button click触发函数

#使用ajax函数，请求salt_key_update

#请求成功时，如果有参数返回，则定向到salt_key_list

　　

function download_log()

{

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

        $.ajax({

            url:"{% url 'log_download' %}",

            type:"POST",

            data:{'server':$("#id_server").val(),'subtype':$("#id_subtype").val(),'logpath':$("#id_logpath").val()},

            success: function (arg) {

                if(arg){

                    window.location.href = arg;

                }

            }

        });

    });

}

#把三个参数发送给log_download，然后返回一个arg，请求这个arg

 #下载url,由js响应

 download_url = 'http://192.168.10.12/%s/files%s'  %(server,zip_name_path)

 return HttpResponse(download_url)

#download_url返回给js

　　

js_jquery的更多相关文章

  1. Java简单示例-用户登录、单个页面的增删改查及简单分页

    index.html  -登录->stulist.jsp (index.html传递到LoginServlet,进行登录检测及写入session,NO返回index.html界面,OK 跳转到s ...

  2. apache tiles 页面模板的使用

    jar包maven <!-- Tiles 模板--> <dependency> <groupId>org.apache.tiles</groupId> ...

  3. jQuery stop()浅析

    作为前端开发人员,JS和JQuery是我们经常用到的开发语言和工具类库.我们都晓得,在jQuery中有一个很强大的方法——stop(),他是阻止在连续动画或事件中出现重复累积状况的方法.那么,stop ...

随机推荐

  1. Automating hybrid apps

    Automating hybrid apps One of the core principles of Appium is that you shouldn’t have to change you ...

  2. for（String s：list）的运行

    源码 List<String> list = new ArrayList<>(); for (String s:list){ } class文件 List<String& ...

  3. LVS的体系结构

    LVS集群的体系结构 章文嵩 (wensong@linux-vs.org) 转自LVS官方资料 2002 年 4 月 本文主要介绍了LVS集群的体系结构.先给出LVS集群的通用体系结构,并讨论了其的设 ...

  4. Oracle序列更新为主键最大值

    我们在使用 Oracle 数据库的时候,有时候会选择使用自增序列作为主键.但是在开发过程中往往会遇到一些不规范的操作,导致表的主键值不是使用序列插入的.这样在数据移植的时候就会出现各种各样的问题.当然 ...

  5. vue 仿今日头条

    vue 仿今日头条 为了增加移动端项目的经验,近一周通过 vue 仿写今日头条,以下就项目实现过程中遇到的问题以及解决方法给出总结,有什么不正确的地方,恳请大家批评指正^ _ ^!,代码仓库地址为 g ...

  6. eval函数用法

    JavaScript 全局对象 定义和用法 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 语法 eval(string) 参数 描述 string 必需.要计算的字 ...

  7. 在js里UTF-8与GB2312的互转

    js的函数如下: function GB2312UTF8() { this.Dig2Dec = function(s) { var retV = 0; if (s.length == 4) { for ...

  8. 「LuoguP2252」 取石子游戏（威佐夫博弈

    [P2252]取石子游戏 - 洛谷 题目背景 无 题目描述 有两堆石子,数量任意,可以不同.游戏开始由两个人轮流取石子.游戏规定,每次有两种不同的取法,一是可以在任意的一堆中取走任意多的石子:二是可以 ...

  9. Autoware docker 环境安装

    环境: ubuntu 16.04    GPU:GeForce 1070   nvidia 驱动型号:nvidia_driver_390.67 安装参考网址: https://github.com/C ...

  10. VS中文档大纲视图的作用

    一.在vs的菜单栏中点击视图==========>其他窗口===========>文档大纲 二.文档大纲的作用是可以查看当前Form窗体的结构,如下图 三.若果感觉控件的类型太长,可以在文 ...