引用

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. MD5 字符串问题

    早上来工位,大家再聊md5,无意中发现网上有个人提出个问题:研究了一下,挺有意思 有个串,通过各种办法得到的值不完全一样,下面请看细节: 假设这个字符串是 “ssss"我用的第一个办法应该是 ...

  2. beego 导入一个普通的包都会执行init方法，如果是struct就不会执行

    default.go package controllers import ( "beego-test/models" "beego-test/service" ...

  3. animation steps属性实现帧动画

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta na ...

  4. Codeforces Beta Round #7 D. Palindrome Degree —— 字符串哈希

    题目链接:http://codeforces.com/contest/7/problem/D D. Palindrome Degree time limit per test 1 second mem ...

  5. java后台获取cookie里面值得方法

    String admissionNo = ""; //得到所有的cookies Cookie[] cookies = this.getRequest().getCookies(); ...

  6. ES6 新特性之Symbol

    Symbol let s1 = Symbol('foo'); let s2 = Symbol('bar'); s1 // Symbol(foo) s2 // Symbol(bar) s1.toStri ...

  7. windows下使用emacs+plink远程编辑erlang文件

    1)plink.exe属于putty套件, 注册到环境变量;emacs的bin目录也要注册到环境变量中; 2)在.emacs中增加如下: (require 'tramp)(setq tramp-def ...

  8. hdu-5670 Machine(水题附上java代码)

    题目链接: Machine  Time Limit: 2000/1000 MS (Java/Others)  Memory Limit: 65536/65536 K (Java/Others) 问题描 ...

  9. 如何配置xmanager

      步骤1:编辑/etc/X11/xdm/Xaccess,将下面的行:  #* # any host can get a login window 改为: * # any host can get a ...

  10. MTK touchscreen 流程

    1. kernel-3.18/drivers/input/touchscreen/mediatek/tpd_common_probe.c static int __init tpd_probe_ini ...