jQuery开发经验实例笔记

jQuery获取文件选择输入框的扩展名

var file=$("input[name='file']").val()

var filename=file.replace(/.*(\/|\\)/, "");　　//文件名

var fileExt=(/[.]/.exec(filename)) ? /[^.]+$/.exec(filename.toLowerCase()) : '';　　//扩展名

今天在用ajaxfileupload时，遇到一个要刷新一次页面才能再次上传，用live()方法来绑定<input type="file">的change事件就能够解决？直接$("xxx").change();只能调用一次，据闻是IE浏览器的安全性。后来终于找到解决方案了。IE浏览器下<input type="file">选择完成自动提交的问题，在每次处理完成后把<input type="file" />替换成原来的代码，然后随便加个不同的属性。如本例中添加了title。

    var count = -1;

    $("#upload").live("change", function () {

        count++;

    $.ajaxFileUpload(config);

    $("#upload").replaceWith("<input type='file' id='upload' name='upload' style='position:relative; top:0px; left:-240px; width:346px; height:46px; opacity:0; filter: Alpha(Opacity=0); cursor:pointer; title=" + count + "' />");

})

jQuery根据生日计算年龄，星座，生肖的实例：

<html>
<head>

    <title></title>

    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        //根据输入的生日自动获取星座，生肖和年龄。

        var year = new Array("猪", "鼠", "牛", "虎", "兔", "龙", "蛇", "马", "羊", "猴", "鸡", "狗");

        jQuery(function () {

            $("#Birthday").blur(function () {

                setTimeout(function () {

                    var strHtml = "";

                    var date = new Date($("#Birthday").val().replace(/-/g, "/"));

                    var con = getxingzuo(date.getMonth() + 1, date.getDate());

                    strHtml += "你的星座是：" + con;

                    var zodiac = year[(parseInt(date.getFullYear()) + 9) % 12];

                    strHtml += "<br/>你的生肖是：" + zodiac;

                    var Age = new Date().getFullYear() - date.getFullYear();

                    strHtml += "<br/>你的年龄是：" + Age;

                    $("#div1").append(strHtml);

                }, 200);

            })

        })

        function getxingzuo(month, day) {

            var d = new Date(1999, month - 1, day, 0, 0, 0);

            var arr = [];

            arr.push(["魔羯座", new Date(1999, 0, 1, 0, 0, 0)])

            arr.push(["水瓶座", new Date(1999, 0, 20, 0, 0, 0)])

            arr.push(["双鱼座", new Date(1999, 1, 19, 0, 0, 0)])

            arr.push(["牡羊座", new Date(1999, 2, 21, 0, 0, 0)])

            arr.push(["金牛座", new Date(1999, 3, 21, 0, 0, 0)])

            arr.push(["双子座", new Date(1999, 4, 21, 0, 0, 0)])

            arr.push(["巨蟹座", new Date(1999, 5, 22, 0, 0, 0)])

            arr.push(["狮子座", new Date(1999, 6, 23, 0, 0, 0)])

            arr.push(["处女座", new Date(1999, 7, 23, 0, 0, 0)])

            arr.push(["天秤座", new Date(1999, 8, 23, 0, 0, 0)])

            arr.push(["天蝎座", new Date(1999, 9, 23, 0, 0, 0)])

            arr.push(["射手座", new Date(1999, 10, 22, 0, 0, 0)])

            arr.push(["魔羯座", new Date(1999, 11, 22, 0, 0, 0)])

            for (var i = arr.length - 1; i >= 0; i--) {

                if (d >= arr[i][1]) return arr[i][0];

            }

        }

    </script>

</head>

<body>

    <div id="div1" style="width:200px;height:200px;">

            <input type="text" id="Birthday" value="请输入你的生日！" />

            <input type="button" value="开始计算" />

    </div>

</body>

</html>

jQuery判断元素下是否有另一指定元素

　　$(this).has("p").length > 0 //此句代码的意思是，含有P的当前元素的数量，如果含有P则为1，不含有P则为0。因为$(this)肯定是1，给它加了个条件，含有P的$(this)要是是1，要么是0 。

　　另外一种方法就是用find

　　$(this).find("p").length > 0　　//此句代码的意思是，含有的P子元素数量是否大于0

<head>

    <script src="jquery-1.7.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

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

                if ($(this).has("p").length > 0) {

                    alert("div1有p子元素s");

                }

            })

        })

    </script>

</head>

<body>

    <div id="div1">

        <p>我是一个P</p>

    </div>

</body>

jQuery判断当前元素是隐藏还是显示

$(this).is(":hidden");　　//如果元素是隐藏的话，则返回true

is挺好用的，他能够用jQuery选择器作为参数，特别是跟jQuery里面的选择器里面那些以冒号开头的筛选符配合使用，实现各种各样的判断。如: ":checked,:hidden"等等。给个例子：

<head>

    <script src="jquery-1.7.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $(":button").click(function () {

                if ($(this).is(":button")) {

                    alert("我是一个按钮!");

                }

                if ($("#check1").is(":checked")) {

                    alert("我是被选中的");

                }

                if ($(".p1").is(":visible")) {

                    alert("p1是可见的");

                }

            })

        })

    </script>

</head>

<body>

    <div id="div1">

        <p class="p1">我是一个p</p>

        <input id="check1" type="checkbox" value="" />复选框

        <input type="button" value="确认" />

    </div>

</body>

jQuery开发经验实例笔记的更多相关文章

jQuery Ajax 实例 ($.ajax、$.post、$.get)
jQuery Ajax 实例 ($.ajax.$.post.$.get) 转 Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了. ...
SVN版本库（访问权限）配置实例笔记
http://blog.csdn.net/zjianbo/article/details/8578297 SVN版本库(访问权限)配置实例笔记本系列文章由ex_net(张建波)编写,转载请注明出处. ...
JavaScript强化教程——jQuery AJAX 实例
什么是 AJAX?AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML).简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据 ...
jQuery AJAX实例
<html><head><title>jQuery Ajax 实例演示</title></head><script language= ...
jQuery Ajax 实例 ($.ajax、$.post、$.get)【转载】
本文转载自:http://jun1986.iteye.com/blog/1399242 Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的 ...
jQuery Ajax 实例 ($.ajax、$.post、$.get)转
Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了. 推荐一篇不错的jQuery Ajax 实例文章,忘记了可以去看看,地址为:ht ...
jQuery 验证实例(shopnc二次开发)
shopnc 商家用户实现添加用户与前台用户分离, jQuery 验证实例 equalTo:等于 <div id="saleRefund" show_id="1&q ...
一个简单的jQuery插件开发实例
两年前写的一个简单的jQuery插件开发实例,还是可以看看的: <script type="text/javascript" src="jquery-1.7.2.m ...
锋利的jQuery幻灯片实例
//锋利的jQuery幻灯片实例 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

随机推荐

BZOJ 1036 [ZJOI2008]树的统计Count（动态树）
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1036 题意:一棵树,每个节点有一个权值.三种操作:(1)修改某个节点的权值:(2)输出某两 ...
UESTC 75 The Queen's New Necklaces
题意:一个项链的珠子的颜色有若干种.每种颜色的珠子个数为Ai.求有多少种不同的项链? 我们考虑,如果旋转i个珠子,那么会产生gcd(n,i)个循环节,每个循环节的大小我们假设为K,那么如果有一个颜色的 ...
Win8.1 MSDN各版本下载(64位/32位,简体中文,繁体中文,英文),X86&X64,EN,CHS,CHT
英文64位ed2k://|file|en_windows_8_1_x64_dvd_2707217.iso|3899295744|8E604054013D21209B851E41DC19F6F5|/ 英 ...
WEB打印插件Lodop
Lodop.C-Lodop使用说明及样例 Lodop(标音:劳道谱,俗称:露肚皮)是专业WEB控件,用它既可裁剪输出页面内容,又可用程序代码直接实现复杂打印.控件功能强大,却简单易用,所有调用如 ...
UESTC_方老师和农场 2015 UESTC Training for Graph Theory<Problem L>
L - 方老师和农场 Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) Submi ...
【转】linux文件系统之mount流程分析
本质上,Ext3 mount的过程实际上是inode被替代的过程. 例如,/dev/sdb块设备被mount到/mnt/alan目录.命令:mount -t ext3 /dev/sdb /mnt/al ...
Zookeeper学习记录（一）：设计与实现
概述 Zookeeper是一个分布式的.开源的分布式应用协调服务.它暴露了一组简单的基础原件,分布式应用可以在这些原件之上实现更高级别的服务,如同步.配置维护.群组.和命名.它被设计成容易编程实现的, ...
Android应用程序线程消息循环模型分析
文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/6905587 我们知道,Android应用程序是 ...
fatal error: malformed or corrupted AST file: 'Unable to load module "/Users/apple/Library/Developer
在同一时候安装使用Xcode5, Xcode6之后, 常常遇到这个问题. fatal error: malformed or corrupted AST file: 'Unable to load m ...
html_day1
第一天学习,了解到html的结构和语法. html的语法: 1.所有的html标签都要放在<>尖括号里. 2.标签不分大小写建议小写 3.标签中的属性与标签名之间要有一个空格,如多个 ...

jQuery开发经验实例笔记

jQuery开发经验实例笔记的更多相关文章

随机推荐

热门专题