引用

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. Mac终端操作SVN指令

    1.将文件checkout到本地目录 svn checkout path(path是服务器上的目录)   例如:svn checkout svn://192.168.1.1/pro/domain    ...

  2. php mcrypt加密实例

    <?php //当前mcrypt支持的加密模型 $modes_list = mcrypt_list_modes(); // Array // ( // [0] => cbc // [1] ...

  3. 负载均衡LVS

    可参考:http://ixdba.blog.51cto.com/2895551/555738 http://os.51cto.com/art/201202/319979.html 也可以参考官网:ht ...

  4. bzoj5259: [Cerc2017]区间

    还是很强的一个题 ORZ肉丝哥哥 对于两个相交区间,假如他们两个都是可行的,那么他们的交也可行,不然没可能两边都把它缺的补上 那么对于答案区间,向右找到第一个可行区间右端点覆盖询问区间,就是最优的 考 ...

  5. Codeforces Round #383 (Div. 2) B. Arpa’s obvious problem and Mehrdad’s terrible solution —— 异或

    题目链接:http://codeforces.com/contest/742/problem/B B. Arpa's obvious problem and Mehrdad's terrible so ...

  6. js里=、== 和===有什么区别?

    说明:该文章是转载后进行修改完善的,望大家有收获. =是赋值运算符,==是关系运算符; ===是全等运算符. ”==”与”===”是不同的,一个是判断值是否相等,一个是判断值及类型是否完全相等.第一个 ...

  7. TCP连接过程

    TCP建立连接与释放连接  最近复习准备<计算机网络>考试,感觉TCP协议建立连接与释放连接这两个过程比较重要,所以把自己理解的部分写下来. 1.建立连接:(三次握手)   (1)客户端发 ...

  8. css父元素背景覆盖其子元素背景

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. Linux-正则表达式与三剑客

    1 固化命令文件 登录时执行文件的顺序 /etc/profile /etc/profile.d ~/.bash_profile ~/.bashrc /etc/bashrc 非登录shell ~/.ba ...

  10. INSTALL_FAILED_UID_CHANGED

    ADT试图安装console显示上面的提示.网上查的办法: 1. 删除/data/app/(filename) 文件夹下的apk包 2. 删除/system/app/(filename) 文件夹下的a ...