jQuery开发经验实例笔记

时间:2022-09-04 19:23:51

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。

jQuery开发经验实例笔记
    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开发经验实例笔记

jQuery根据生日计算年龄,星座,生肖的实例:

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开发经验实例笔记

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

jQuery开发经验实例笔记
<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开发经验实例笔记

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

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

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

jQuery开发经验实例笔记
<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开发经验实例笔记的更多相关文章

  1. jQuery Ajax 实例 &lpar;&dollar;&period;ajax、&dollar;&period;post、&dollar;&period;get&rpar;

    jQuery Ajax 实例 ($.ajax.$.post.$.get) 转 Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了. ...

  2. SVN版本库(访问权限)配置实例笔记

    http://blog.csdn.net/zjianbo/article/details/8578297 SVN版本库(访问权限)配置实例笔记 本系列文章由ex_net(张建波)编写,转载请注明出处. ...

  3. JavaScript强化教程——jQuery AJAX 实例

    什么是 AJAX?AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML).简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据 ...

  4. jQuery AJAX实例

    <html><head><title>jQuery Ajax 实例演示</title></head><script language= ...

  5. jQuery Ajax 实例 &lpar;&dollar;&period;ajax、&dollar;&period;post、&dollar;&period;get&rpar;【转载】

    本文转载自:http://jun1986.iteye.com/blog/1399242 Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的 ...

  6. jQuery Ajax 实例 &lpar;&dollar;&period;ajax、&dollar;&period;post、&dollar;&period;get&rpar;转

    Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了. 推荐一篇不错的jQuery Ajax 实例文章,忘记了可以去看看,地址为:ht ...

  7. jQuery 验证实例&lpar;shopnc二次开发&rpar;

    shopnc 商家用户实现添加用户与前台用户分离, jQuery 验证实例 equalTo:等于 <div id="saleRefund" show_id="1&q ...

  8. 一个简单的jQuery插件开发实例

    两年前写的一个简单的jQuery插件开发实例,还是可以看看的: <script type="text/javascript" src="jquery-1.7.2.m ...

  9. 锋利的jQuery幻灯片实例

    //锋利的jQuery幻灯片实例 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

随机推荐

  1. Android样式之selector

    日常开发当中,难免会出现这样一种情况,为一个按钮.TextView...设置一个点击状态的颜色改变,可能是background背景的改变,也可能是字体颜色的改变,简单点说:默认状态下,字体颜色或者背景 ...

  2. Android UI&colon;ListView -- SimpleAdapter

    SimpleAdapter是扩展性最好的适配器,可以定义各种你想要的布局,而且使用很方便. layout : <?xml version="1.0" encoding=&qu ...

  3. C&plus;&plus;运算符重载的规则

    运算符重载的规则如下: 1.C++中的运算符除了少数几个之外,全部可以重载,而且只能重载C++中已经有的运算符. 2.重载之后运算符的优先级和结合性都不会改变 3.运算符重载是针对新类型数据的实际需要 ...

  4. MySQL学习笔记&lpar;1&rpar; - cmd登陆和退出

    1. 打开cmd,输入,回车 mysql -uroot -p -P3306 -h127. 1)-u :指定用户名,root为超级权限用户. 2)-p :输入密码,不指定时回车后会提示输入密码,并用*号 ...

  5. Git 1&period;9&period;5&period;msysgit&period;1

    Git 1.9.5.msysgit.1 发布,现已提供下载:https://github.com/msysgit/git/archive/v1.9.5.msysgit.1.zip. Git是一个开源的 ...

  6. codeforces 782B The Meeting Place Cannot Be Changed &lpar;三分&rpar;

    The Meeting Place Cannot Be Changed Problem Description The main road in Bytecity is a straight line ...

  7. C&sol;JS&lowbar;实现冒泡排序

    冒泡排序算法的运作如下:(从后往前) 比较相邻的元素.如果第一个比第二个大,就交换他们两个. 对每一对相邻元素作同样的工作,从开始第一对到结尾的最后一对.在这一点,最后的元素应该会是最大的数. 针对所 ...

  8. 原生的强大DOM选择器querySelector - querySelector和querySelectorAll

    在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 tag, name, id ...

  9. &lbrack;Leetcode Week14&rsqb;Construct Binary Tree from Inorder and Postorder Traversal

    Construct Binary Tree from Inorder and Postorder Traversal 题解 原创文章,拒绝转载 题目来源:https://leetcode.com/pr ...

  10. 使用Eclipse的几个必须掌握的快捷方式

    “工若善其事,必先利其器”,感谢Eclipse,她 使我们阅读一个大工程的代码更加容易,在阅读的过程中,我发现掌握几个Eclipse的快捷键会使阅读体验更加流畅,写出来与诸君分享,欢迎补充. 1. C ...