jquery----语法扩展(导入js文件)

时间：2022-08-26 21:28:42

简单使用

第一步，新建js文件

第二步，在js文件中添加

$.extend({

      "GDP": function () {

         console.log("哈哈哈哈");

      }

   });

第三步，在html中使用

　　$.GDP()  即可

复杂(1,希望一些函数不可以被外部引用，不可以被修改$)

(function (jq) {

    jq.extend({

       "GDP":function () {

           foo();          //调用内部函数

          console.log("带小红花")

       },   //可以扩展多个（加上逗号在写几个）

        "SGS":function () {

          console.log("你蛤蟆")

    }

});

    function foo() {

        console.log("英语八级就是牛")

    }

})(jQuery);

(function (jq) {

    jq.fn.extend({

    "BJG":function () {

        foo2();

        console.log("就这样吧")

    }

});

    function foo2() {

        console.log("哎哎呀")

    }

})(jQuery);

练习----t.js 文件

// 匿名函数

(function (jq) {  //jq就相当于$

    jq.extend({

        "myValidate": function (form) {

            var formObj = jq(form) ;//赋一个变量，因为我们经常用到

            formObj.find("button").on("click", function () {

                console.log("-------------")

                formObj.find(".form-group").removeClass("has-error");

                formObj.find("span").text("");

                formObj.find(":input").each(function () {

                    if ($(this).val().length === ) {

                        console.log("")

                        var name = $(this).prev().text();

                        $(this).parent().addClass("has-error");

                        $(this).next().text(name + "不能为空");

                        return false

                    }

                });

                return false

            });

        }

    })

})(jQuery);

tjs

html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>作业1</title>

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

    <link rel="stylesheet" type="text/css" href="bootstrap.min.css">

    <style>

        .container {

            margin-top: 50px;

        }

    </style>

</head>

<body>

<div class="container">

    <div class="row">

        <div class="col-md-4 col-md-offset-4">

            <form action="#"  novalidate id="login">

                <div class="form-group">

                    <label for="username">用户名</label>

                    <input type="text" class="form-control" id="username" placeholder="username" required="true">

                    <span id="helpBlock" class="help-block"></span>

                </div>

                <div class="form-group">

                    <label for="Password">密码</label>

                    <input type="password" class="form-control" id="Password" placeholder="Password">

                    <span id="helpBlock2" class="help-block"></span>

                </div>

                <button type="submit" class="btn btn-default submit">提交</button>

            </form>

        </div>

    </div>

</div>

<script src="t.js"></script>

<script>

    $.myValidate()

</script>

<!--<script>-->

    <!--$(".submit").on("click",function () {-->

        <!--$("form .form-group").removeClass("has-error");-->

        <!--$("form span").text("");-->

        <!--$(":input").each(function () {-->

            <!--if ($(this).val().length===){-->

                <!--var name =  $(this).prev().text();-->

                <!--$(this).parent().addClass("has-error");-->

                <!--$(this).next().text(name+"不能为空");-->

                <!--return false-->

            <!--}-->

        <!--});-->

    <!--return false-->

    <!--})-->

<!--</script>-->

</body>

</html>

html

jquery----语法扩展(导入js文件)的更多相关文章

  1. vue中如何在本地导入js文件

    import {setStore,setUser,getStore,removeStore} from "../../../public/localstory" 在导入js文件时, ...

  2. Boostrap本地导入js文件

    我一般都是用CDN直接导入的,但是有时候需要自己添加一些功能进入,会用到本地导入.关于导入路径问题,做个笔记. 使用HBuilder,首先右键导入相应的js/cs文件 然后是常规——>文件系统 ...

  3. 向MyEclipse的项目中导入js文件时，出现小红叉

    这个问题困扰我很久.刚开始时,也没有解决,因此也在网上寻找解决方法,还是没能解决.最近做项目时再一次出现了这样的问题,于是决定还是再找找办法.在此,分享一下自己的解决方法,给正处于痛苦中的童鞋们带来解 ...

  4. 使用Jquery promise 动态引入js文件

    动态加载一个js得方式很多,如下方式: /** *一般方式加载 */ function normalLoadScript(url) { var node = document.createElemen ...

  5. 动态导入Js文件

    var ScriptLoader = { worker: , isWait: false, readyQueue: [], callback: [], timer: null, wait: funct ...

  6. 使用jQuery的时候，js文件代码位置规范

    /** * 页面加载之后执行的函数:===================================== */$(function() { }); //如果需要同步执行需要同时编写在这里: $( ...

  7. 自己编写jQuery动态引入js文件插件 &lpar;jquery&period;import&period;dynamic&period;script&rpar;

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

  8. 1&period;在html中引入js文件和Jquery框架

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. jQuery的基础跟JS的正则

    大家好,我是唯芸星,这是我的一点点学过的知识,呈现给大家                   1:正则表达式 包括: 1:正则表达式包括两部分 ①:定义正则表达式的规则 ②:正则表达式的规模(i/g/ ...

随机推荐

  1. V2EX社区

    无论你是在大学进行人生最重要阶段的学习,或者是在中国的某座城市工作,或者是在外太空的某个天体如 Sputnik 1 上享受人生,在注册进入 V2EX 之后,你都可以为自己设置一个所在地,从而找到更多和 ...

  2. LDPY Ghost Win7 64位 纯净自选版 V5&period;0

    ★ 概述: ☆ 源安装盘是[Windows7_SP1_ULTIMATE]微软官方SP1正式版. ☆ 破解激活WIN7,补丁更新至2013/06/18所有系统安全关键补丁. ☆ 破解 Windows 7 ...

  3. iOS开发——swift精讲&amp&semi;MVC应用实战

    MVC应用实战 iOS开发中设计模式是很重要的,其中,使用最多的就是MVC模式,今天就简单介绍一下在Swift中这么使用MVC模式来实现我们想要的功能: 模型-视图-控制器(Model-View-Co ...

  4. Oracle SQL函数之转换函数

    chartorowid(c1) [功能]转换varchar2类型为rowid值 [参数]c1,字符串,长度为18的字符串,字符串必须符合rowid格式 [返回]返回rowid值 [示例] SQL&gt ...

  5. php与MySQL&lpar;php内置mysql函数&rpar;

    获取数据 在讲解下面的方法之前,我们首先来看一下我们的数据表的结构: mysqli_fetch_row()函数 mysqli_fetch_row()函数从结果集中取得一行,并以索引数组形式返回. 语法 ...

  6. BZOJ&colon;4816&colon; &lbrack;Sdoi2017&rsqb;数字表格

    4816: [Sdoi2017]数字表格 Time Limit: 50 Sec  Memory Limit: 128 MBSubmit: 501  Solved: 222[Submit][Status ...

  7. P5300 &lbrack;GXOI&sol;GZOI2019&rsqb;与或和

    题目地址:P5300 [GXOI/GZOI2019]与或和 考虑按位计算贡献 对于 AND 运算,只有全 \(1\) 子矩阵才会有贡献 对于 OR 运算,所以非全 \(0\) 子矩阵均有贡献 如果求一 ...

  8. python 字符串常用操作

    字符串常用方法 capitalize() String.capitalize() 将字符串首字母变为大写 name = 'xiaoming' new_name = name.capitalize() ...

  9. Linux系统常用升级的基础包

    Linux系统常用升级的基础包 yum -y install lrzsz gcc gcc-c++ make flex autoconf automake vixie-cron libjpeg libj ...

  10. org&period;apache&period;poi 读取数字问题

    默认呢,POI读取单元格内容为数字的话,自动搞成Dubbo类型的,比如这样: String value1 = row.getCell(0).getNumericCellValue()+"&q ...

相关文章