![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
jQuery
colorsunlight_110
这个作者很懒,什么都没留下…
展开
-
jQuery实现拖放
position属性必须设置为absolute,否则不起作用<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js/jquery-ui-1.10.4.custom.js"></script><原创 2015-03-25 16:47:41 · 701 阅读 · 0 评论 -
focus和blur事件实现提示文本的显示与隐藏
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script src="../原创 2015-03-09 16:33:35 · 796 阅读 · 0 评论 -
设定div始终居中显示
<script type="text/javascript">(function($){ $.fn.extend({ center:function(options){ //center插件 var options=$.extend({ //默认属性值 inside:window,原创 2015-03-17 10:28:34 · 753 阅读 · 0 评论 -
获取鼠标的坐标
$(document).ready(function(){ $(document).mousemove(function(e){ x=e.screenX; y=e.screenY; $("span").text("X:"+x+",Y:"+y); }) })原创 2015-03-09 15:27:56 · 535 阅读 · 0 评论 -
实现文字闪烁效果
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script src="../原创 2015-03-09 17:42:21 · 980 阅读 · 0 评论 -
实现可折叠效果
<script type="text/javascript">$(document).ready(function(){ $(".help h3").click(function(){ $(this).next("p").slideToggle("fast"); })})</script></head><body> <div class="help"原创 2015-03-10 10:39:33 · 750 阅读 · 0 评论 -
图片预加载
<script type="text/javascript"> var image="../public/img/瑟兰迪尔1.jpeg"; $(document).ready(function(){ window.setTimeout(function(){ var img=$("<img>").attr("src",image).load(f原创 2015-03-30 17:04:40 · 437 阅读 · 0 评论 -
判断浏览器版本
IE 只有IE支持创建ActiveX控件,因此她有一个其他浏览器没有的东西,就是ActiveXObject函数。只要判断window对象存在ActiveXObject函数,就可以明确判断出当前浏览器是IE。而IE各个版本典型的userAgent如下: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0) Mozilla/4.0 (com转载 2015-03-12 16:38:18 · 496 阅读 · 0 评论 -
jquery模拟可输入的下拉框
//页面html<div id="select" class="select" > <ul> <c:forEach items="${movieCityList}" var="cy" varStatus="st">原创 2015-03-12 14:17:54 · 1103 阅读 · 0 评论 -
图片加载错误处理
<script src="../public/js/jquery-1.8.3.js"></script><title>预加载</title><script type="text/javascript"> $(document).ready(function(){ $("img").each(function(i,e){ var imgsrc=$(e原创 2015-03-30 17:34:34 · 839 阅读 · 0 评论 -
jquery ui选中多个元素
<style type="text/css">li { background: #eef; margin-bottom:5px; list-style-type: none;}.color1{background: #ffe; margin-bottom:5px; list-style-type: none; }</style><sc原创 2015-03-30 10:29:08 · 1444 阅读 · 0 评论 -
jquery ui选中表格多行数据
<script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js/jquery-ui-1.10.4.custom.js"></script><script src="../public/js/jquery-ui.js"></script><link rel="style/css" href="../pub原创 2015-03-30 11:06:30 · 1759 阅读 · 0 评论 -
jQuery给select,textarea标签赋值
var html=[]; html.push(“原创 2015-03-12 10:09:53 · 1557 阅读 · 0 评论 -
限制文本域中字符输入个数
<script type="text/javascript"> $(function(){ jQuery.fn.maxLength=function(max){ return this.each(function(){ var type=this.tagName.toLowerCase();原创 2015-03-13 17:13:27 · 986 阅读 · 0 评论 -
禁止回车键提交
//当回车键提交时聚焦到当时触发onkeypress事件的元素对象年龄输入框<script type="text/javascript"> $(function(){ $("input").keypress(function(e){ var keyCode=e.keyCode?e.keyCode:e.which?e.which:e.charCode;原创 2015-03-13 18:01:49 · 688 阅读 · 0 评论 -
jQuery插件总结
charCount.js 实现textarea文字输入限制 quoteRotator.min.js实现文字动画效果 $(selector).quetoRator() jquery.moatext-min.js实现文字动画效果原创 2015-03-10 10:54:08 · 817 阅读 · 0 评论 -
jQuery.ajax向后台传数组
如果html中checkbox选中多条记录向后台传值,js实现如下var orderIds=[]; var userCodes=[]; $("input[name='cBox']:checked").each(function(){//选中的checkbox记录,循环取出每条记录中orderId和userCode原创 2015-03-24 17:02:09 · 721 阅读 · 0 评论 -
阻止文本行换行
<script type="text/javascript"> function strReplace(str){ var t="",len=0; t=str.replace(/\r\n\g,"\\n").replace(/\n\g,""); document.form.output.value=t; }</script><body><form id=原创 2015-03-09 14:46:53 · 835 阅读 · 0 评论 -
JS中document属性
document.title //设置文档标题等价于HTML的title标签 document.bgColor //设置页面背景色 document.fgColor //设置前景色(文本颜色) document.linkColor //未点击过的链接颜色 document.alinkColor //激活链接(焦点在此链接上)的颜色 document.vlinkColor //已点击过的链接原创 2015-03-10 09:16:48 · 944 阅读 · 0 评论 -
延迟显示子菜单方法
hoverIntent插件—实现子菜单延时显示可以防止鼠标经过时的误点击操作<title>延时显示子菜单的方法</title><script type="text/javascript">$(document).ready(function(){ $("#demo6").hoverIntent({ over: makeTall, o原创 2015-03-16 16:17:54 · 894 阅读 · 0 评论 -
禁止右键弹出菜单
<script src="../public/js/jquery-1.8.3.js"></script><title>禁止右键单击上下文菜单</title><script type="text/javascript"> $(function(){ $(document).bind("contextmenu",function(e){ $("text原创 2015-03-16 10:22:57 · 570 阅读 · 0 评论 -
jQuery和javascript中event属性
javascript中event属性说明 1.altKey 描述: 检查alt键的状态。 语法: event.altKey 可能的值: 当alt键按下时,值为 TRUE ,否则为 FALSE 。只读。 2.button 描述: 检查按下的鼠标键。 语法: event.button 可能的值: 0 没按键 1 按左键 2 按右键 3 按左右键 4 按中间键 5 按左键和中间键 6 按翻译 2015-03-13 16:14:21 · 718 阅读 · 1 评论 -
jQuery插件jquery ui实现拖放
cusor为move表示光标为move类型,cursorAt指示光标所在的位置。当删除了拖拽功能后,必须要再次调用draggable()才能继续使用拖拽<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../pub原创 2015-03-26 14:16:16 · 846 阅读 · 0 评论 -
限制移动范围的拖放
<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js/jquery-ui-1.10.4.custom.js"></script><script src="../public/js/jquer原创 2015-03-26 16:30:20 · 1566 阅读 · 0 评论 -
jQuery使用事件监控拖曳次数
draggable插件拖动过程:当按下鼠标准备拖动时,触发start事件,拖动过程中触发drag事件,拖动完成时(松开鼠标)触发stop事件<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js原创 2015-03-27 14:06:14 · 532 阅读 · 0 评论 -
jQuery ui限制可放置的元素
$(document).ready(function(){ //开启拖曳功能 $("#draggable,#draggable2").draggable(); //启用拖放功能的支持 $("#droppable").droppable({ accept:"#draggable", //设置允许拖放的元素 activeC原创 2015-03-27 14:52:53 · 1204 阅读 · 0 评论 -
实现监听输入框字符的变化
<script type="text/javascript"> $("#in").bind("input propertychange",function(){ alert("hello"); })</script></head><body> <input type="text" id="in" value="" size=64/></body>注:i原创 2015-03-16 10:09:21 · 605 阅读 · 0 评论 -
双击不选中文本
<script type="text/javascript">$(document).ready(function(){ var clearSeletion=function(){ if(document.selection&&document.selection.empty){ document.selection.empty();原创 2015-03-16 13:22:34 · 1551 阅读 · 0 评论 -
设定事件间隔和延迟
<script type="text/javascript">var t=self.setInterval("clock()", 50);function clock(){ var time=new Date(); document.getElementById("clock").value=time;}function timeMsg(){ iSecond=Math.原创 2015-03-16 14:34:54 · 929 阅读 · 0 评论 -
获取页面加载时间
document.readyState页面当前状态位有如下值 UNINITIALIZED(0):表示XML对象被产生,但没有任何文件被加载 LOADING(1):表示加载程序进行中,单文件尚未开始解析 LOADED(2):表示部分文件已经加载且进行解析,但对象模型尚未生效 INTERACTIVE(3):表示仅对已加载的部分文件有效,在此情况下,对象模型是有效但只读的 COMPLETED(4原创 2015-03-16 16:36:39 · 2050 阅读 · 0 评论 -
jQuery具有对齐功能的拖放
<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js/jquery-ui-1.10.4.custom.js"></script><script src="../public/js/jquer原创 2015-03-27 13:26:05 · 1939 阅读 · 0 评论 -
拖放到目标容器
$(document).ready(function(){ //开启拖曳功能 $("#draggable").draggable(); //启用拖放功能的支持 $("#droppable").droppable({ drop:function(event,ui){ $(this).find("p").html("已经拖放到了目的原创 2015-03-27 14:37:13 · 606 阅读 · 0 评论 -
jQuery ui 拖放函数
1.obj.draggable({distance:20})//指定仅当距离移动超过20像素后才开始进行拖动 2.obj.draggable({delay:1000})//仅当鼠标拉动了1000毫秒以后才开始进行拖放 3.obj.disableSelection()//在拖动时使其文字不能被选择 4.obj.draggable({snap:true});//在拖拽时,捕捉所有元素原创 2015-03-27 11:07:21 · 869 阅读 · 0 评论 -
height/innerHeight/outerHeight
<script>$(document).ready(function(){ alert("height:"+$("#div").height()); //20px; height属性值 alert("innerHeight:"+$("#div").innerHeight());//30px; height属性值+padding属性值*2 alert("outerHeig原创 2015-03-17 10:58:42 · 582 阅读 · 0 评论 -
实现可拖放的购物车
<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="../public/js/jquery-1.8.3.js"></script><script src="../public/js/jquery-ui-1.10.4.custom.js"></script><script src="../public/js/jquer原创 2015-03-27 17:40:20 · 681 阅读 · 0 评论 -
jquery笔记
jquery判断元素是否存在 :$(expr).length>0存在,否则不存在 js格式化float parseFloat(string s).toFixed(小数位数)原创 2015-05-11 13:59:43 · 576 阅读 · 0 评论