- 浏览: 188690 次
- 性别:
- 来自: 深圳
文章分类
最新评论
1.jQuery得到用户IP:
$.getJSON("http://jsonip.appspot.com?callback=?", function (data) {
alert("Your ip: " + data.ip);
});
2.jQuery查看图片的宽度和高度:
var theImage = new Image();
theImage.src = $('#imageid').attr("src");
alert("Width: " + theImage.width);
alert("Height: " + theImage.height);
3.jQuery查找指定字符串:
var str = $('*:contains("the string")');
4.js 判断浏览器是否启用cookie:
$(document).ready(function () {
document.cookie = "cookieid=1; expires=60";
var result = document.cookie.indexOf("cookieid=") != -1;
if (!result) {
alert("浏览器未启用cookie");
}
});
5.jQuery检测键盘按键:
$(document).ready(function () {
$(this).keypress(function (e) {
switch (e.which) {
case 13:
alert("您按下了回车键");
break;
//more detect
}
});
});
好了,本篇就小结到这里,希望本篇jQuery代码片段文章能对大家起到帮助作用
1.jQuery 滚动到顶部/底部
关于jQuery滚动,本站在之前已经发过类似文章,如:jQuery 回到顶部,下边将它们再次整理一下:
//滚动到顶部
$("html, body").animate({ scrollTop: "0px" }, 1000);
//滚动到底部
//$("#container"):要滚动的元素
$("html, body").animate({
scrollTop: $("#container").height()
}, 1000);
2.jQuery 判断元素是否存在
怎么使用 jQuery 判断元素是否存在,相信不少 jQuery 学习者都会问这个问题,方法很简单,如下:
if ($(" #elementid").length) {
//元素存在
}
3.使用 abort() 方法取消 Ajax 请求
使用 abort() 方法在执行 js 异步请求的时候可以取消上一次的请求,方法如下:
var req = $.ajax({
type: "post",
url: "/article/form/comment.aspx",
data: { "id": 1 },
success: function() {
//handle
}
});
//取消 Ajax 请求
if (req) {
req.abort()
}
jQuery Ajax 是使用 jQuery 比较重要的一块,如果你是 jQuery 初学者,可能会对上边的代码感觉到陌生,或许你可以看看 jQuery学习大总结(五)jQuery Ajax 。
4.jQuery 禁用鼠标右键
$(document).ready(function() {
$(document).bind("contextmenu", function() {
return false;
});
});
5.向由setTimeout()调用的方法中传参
$(document).ready(function() { timeout = setTimeout(function() { showMess("succeed") }, 2000); }); function showMess(m) { alert(m); }
1.jQuery 倒计时
$(document).ready(function () { var count = 10; countdown = setInterval(function () { $("p.countdown").html(count + " 秒后将跳转!"); if (count == 0) { clearInterval(countdown) window.location = 'http://google.com'; } count--; }, 1000); });
2.jQuery 判断浏览器类型及版本号
jQuery 判断浏览器类型及版本号非常简单,可以直接使用 $.browser 方法进行判断。但我自己试验时发现在判断 Chrome 浏览器时,返回的是 Safari,在网上找了下,于是有了下边的代码:
var browserName = navigator.userAgent.toLowerCase(); mybrowser = { version: (browserName.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || [0, '0'])[1], safari: /webkit/i.test(browserName) && !this.chrome, opera: /opera/i.test(browserName), firefox: /firefox/i.test(browserName), msie: /msie/i.test(browserName) && !/opera/.test(browserName), mozilla: /mozilla/i.test(browserName) && !/(compatible|webkit)/.test(browserName) && !this.chrome, chrome: /chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName) } $(document).ready(function () { if (mybrowser.msie) { alert("浏览器为:Internet Explorer 版本号为:" + $.browser.version); } else if (mybrowser.mozilla) { alert("浏览器为:Firefox 版本号为:" + $.browser.version); } else if (mybrowser.opera) { alert("浏览器为:Opera 版本号为:" + $.browser.version); } else if (mybrowser.safari) { alert("浏览器为:Safari 版本号为:" + $.browser.version); } else if (mybrowser.chrome) { alert("浏览器为:Chrome 版本号为:" + mybrowser.version); } else { alert("神马"); } });
3.jQuery 元素居中显示
关于元素居中你可以先参考下css实现对象完全居中,了解下其中的原理,之后再看下边使用jQuery 实现元素居中就比较简单了。
//写成了插件形式 (function ($) { jQuery.fn.center = function () { this.css('position', 'absolute'); this.css('top', ($(window).height() - this.height()) /2 +$(window).scrollTop() + 'px'); this.css('left', ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + 'px'); return this; } })(jQuery); $(document).ready(function () { //调用 $("#somediv").center(); });
4.jQuery 判断图像是否被完全加载进来
$("#demoImg").attr("src", "demo.jpg").load(function() { alert("图片加载完成"); });
如果你有什么实用的 jQuery 代码片段,欢迎在 jQuery学习上和大家分享!
发表评论
文章已被作者锁定,不允许评论。
-
使用SignalR构建一个最基本的web聊天室
2015-01-06 15:09 761使用SignalR,可以使用服务器消息推送到客户端,件demo ... -
lazyload异步加载图片
2014-12-24 15:18 531如果一个网页很长并且有很多图片的话,下载图片就需要很多时间 ... -
checbox,redio超强样式运用
2013-06-04 16:49 796<html xmlns="http://ww ... -
一个避免用户重复点击按钮造成重复数据的小技巧
2013-01-13 16:13 1218<script> //启用 ... -
.net 用JQuery+ajax实现批量上传图片
2012-08-07 23:15 1500先看效果图 点击增加按钮,会增加一个选择框, ... -
类似QQ选择组
2012-04-11 19:07 743<style>td {font:12px;}.ti ... -
javascript弹出窗口大全
2011-09-21 20:27 696关键字: 弹出窗口 如何利用网页弹出各种形式的窗口,我想大家大 ... -
合并单元格
2011-07-21 17:33 874<html ><head><me ... -
10大Ajax开发守则
2011-06-08 14:14 7691.前、端后都要做好安全的把关工作不能单靠前端做安全验证工作, ... -
Asp.net前台调后台方法
2011-05-30 16:51 1520 这个当然不用说大家都知道的一种就是ajax ... -
jQuery中常用的函数方法汇总
2011-05-23 00:16 777事件处理 ready(fn) 代 ... -
jquery选择器,过滤器介绍
2011-05-19 19:20 887一、JQuery与JavaScript 1.Jav ... -
jquery常用过滤选择器
2011-05-19 19:18 726过滤选择器主要 ... -
jquery函数
2011-05-18 23:25 675函数:after(content)功能:在每个匹配的元素后面添 ...
相关推荐
从给定的文件信息中,我们可以提炼出一系列关于jQuery的重要知识点,这50个代码片段不仅展示了jQuery的强大功能,还提供了实用的编程技巧,适用于各种JavaScript项目。以下是对部分代码片段的详细解释: ### 1. ...
标题中提到的是“直接拿来用的15个jQuery代码片段”,这表明本文将分享十五个可以直接应用于项目中的实用jQuery代码片段。jQuery是广泛使用的一个JavaScript库,它简化了HTML文档遍历、事件处理、动画以及AJAX交互...
这个“45个实用的jquery代码片段”集合为开发者提供了丰富的资源,可以帮助他们更高效地开发网页应用。下面,我们将详细讨论这些jQuery代码片段中的关键知识点。 1. **选择器**:jQuery提供了丰富且直观的选择器,...
### jQuery实用代码片段集合知识点 ...以上知识点涵盖了在实际开发中常用的jQuery代码片段,它们可以提高开发效率,增强用户体验。通过这些实用的代码片段,开发者可以更灵活地处理常见的前端开发场景。
这篇博文"jQuery常用代码片段"很可能是为了分享一些实用的jQuery代码示例,帮助开发者提高工作效率。下面我们将深入探讨jQuery的一些核心功能和常见用法。 1. **选择器**: jQuery的选择器类似于CSS,可以轻松地选取...
10 个很棒的 jQuery 代码片段 - 代码分享
以下是从60个实用jQuery代码片段中提取的知识点: 1. **选择器与过滤**:`filter()`方法允许根据指定条件筛选元素集合,如`":not(:has(.selected))"`用于移除包含特定类的元素。 2. **元素引用**:存储已选择的...
《超实用的jQuery代码段》这本书提供了大量实用的jQuery代码片段,这些片段可以帮助开发者快速地解决实际项目中遇到的问题。通过学习本书,不仅可以提升使用jQuery的能力,还能提高开发效率。对于初学者来说,这本书...
本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助。其中的一些代码段是从jQuery1.4.2 才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助你又快又好地把事情完成。
10个超实用的jQuery代码片段 jQuery以其强大的功能和简单的使用成为了前端开发者最喜欢的JS类库,在这里我们分享一组实用的jQuery代码片段,希望大家喜欢!
《超实用的jQuery代码段》是一本专注于jQuery实践的书籍,其配套源码提供了一整套丰富的代码示例,帮助读者深入理解并掌握jQuery库在实际项目中的应用。jQuery是JavaScript的一个强大库,它简化了DOM操作、事件处理...
在本文中,我们将探讨一些常用的 jQuery 代码片段,这些片段在实际开发中非常实用。 1. **导航菜单背景切换效果** 当用户点击导航菜单项时,常常需要改变激活项的背景色。以下代码展示了如何使用 jQuery 实现这一...
以下是从"高效Web开发的10个jQuery代码片段"中提炼出的关键知识点: 1. **检测Internet Explorer版本**: 使用`navigator.userAgent`对象可以检测用户使用的浏览器类型。通过匹配字符串`msie/i`,我们可以判断是否...
### 50个必备的实用jQuery代码段 #### 1. 如何创建嵌套的过滤器 嵌套过滤器能够帮助我们进一步精简选择器的结果集。例如,我们需要找到所有不包含特定类(如 `selected`)子元素的元素。 ```javascript // 创建一...
在Visual Studio 2010 和 2012 这两个版本中,开发人员可以利用jQuery代码片段来提高编码效率。本文将详细介绍如何在VS2010和VS2012中使用这些代码片段,以及它们为何被视为“最好用”的。** **一、安装jQuery库** ...
下边这些jQuery片段只是很少的一部分,如果您在学习过程中也遇到过一些常用的jQuery代码,欢迎分享。下边就让我们看看这些有代码片段。 1.jQuery得到用户IP: 代码如下: $.getJSON(...
以下是从给定的“49个jQuery代码经典片段”中提炼出的一些关键知识点: 1. **修改 jQuery 默认编码**: jQuery 默认使用 UTF-8 编码,但可以通过 `$.ajaxSetup` 设置全局的 `contentType` 来改变编码,如将编码改...
**jQuery选择器大全** jQuery库以其易用性和强大的选择器...结合代码片段和21幅图的演示,可以更直观地理解并掌握每个选择器的工作原理和应用场景。在实际项目中,熟练运用jQuery选择器能大大提高开发效率和代码质量。