引用

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. UVA10129 Play on Words —— 欧拉回路

    题目链接:https://vjudge.net/problem/UVA-10129 代码如下: // UVa10129 Play on Words // Rujia Liu // 题意:输入n个单词, ...

  2. Android高手应该精通哪些内容

    很多Android开发者已经度过了初级.中级,如何成为一个Android高手呢? Android123就各个级别的程序员应该掌握哪些内容作为下面分类. 一.初级 1. 拥有娴熟的Java基础,理解设计 ...

  3. SVG-Android开源库——SVG生成Vector资源文件的编辑预览工具

    Vector矢量图在Android项目中的应用越来越广泛,但是如果你想用Android Studio自带的工具将SVG图片转化成Vector资源文件却是相当麻烦,首先能支持的SVG规范较少,其次操作流 ...

  4. webpack 基本功能和原理

    依赖管理:方便引用第三方模块.让模块更容易复用.避免全局注入导致的冲突.避免重复加载或加载不需要的模块. 合并代码:把各个分散的模块集中打包成大文件,减少HTTP的请求链接数,配合UglifyJS可以 ...

  5. heartbeat3.x部署安装

    使用Heartbeat构建Linux双机热备系统 本文档版本号: V1.0 版 本 历 史 版本号 更新时间 说 明 创建者 V1.0 2013-3-23 修改版 金桥 1 部署环境 OS: Red ...

  6. pytest用例setup和teardown

    函数式以下两种: setup_function/teardown_function  每个用例开始和结束调用一次 setup_module/teardown_module     setup_modu ...

  7. 网络应用软件结构-----CS与BS结构（网络基本知识小结）

    1.网络的大致结构 2.网络编程 通过直接或间接地使用网络通讯的协议实现计算机与计算机之间的通讯.在TCP/IP协议层主要麦网络主机的定位,数据传输的路由,由IP地址可以唯一地确定Internet上的 ...

  8. 使用BFG清除git仓库中的隐私文件或大文件

    使用git时间不长,在调机械臂项目的时候,由于对TwinCAT3和vs的机制不太了解,没有添加很好的忽略文件(.gitignore).造成git仓库包含了很多没有用的文件,例如vs的sdf文件,Twi ...

  9. Visual Studio 2017 本地调试 Chrome浏览器自动退出

    在使用VS 2017(15..6 .15.7)对.NET Core MVC应用程序进行本地调试的时候,选择使用Chrome浏览器.但输入中文 就自动关闭Chrome浏览器,随后结束调试.但复制.粘贴中 ...

  10. 【Linux学习】Linux文件系统4—Linux文件硬链接与软连接

    Linux文件系统4-Linux文件硬链接与软连接 inode:索引节点 (连接文件)link 一.文件硬链接 1.Linux文件系统中,inode只相同的文件是硬链接文件 2.不同文件名,inode ...