sortable items不让他拖,也不让他放。cancel不然他拖动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>selectable</title>
<link href="css/ui-lightness/jquery-ui-1.8.10.custom.css" rel="stylesheet" />
<style type="text/css">
*{ margin:0px; padding:0px;}
body{ padding:20px; font:12px Arial, Helvetica, sans-serif;}
ul,li{ list-style:none;}
#s_item,#s_item2{ width:280px; float:left;}
#s_item li,#s_item2 li{ width:260px; height:30px; border:1px solid #ccc; margin-bottom:3px; line-height:30px; text-indent:8px; background:#eee;}
#s_item2 li{ background:#fcc;}
</style>
<script language="javascript" type="text/javascript" src="js/jquery-1.4.4.js"></script>
<script language="javascript" type="text/javascript" src="js/ui/jquery.ui.core.js"></script>
<script language="javascript" type="text/javascript" src="js/ui/jquery.ui.widget.js"></script>
<script language="javascript" type="text/javascript" src="js/ui/jquery.ui.mouse.js"></script>
<script language="javascript" type="text/javascript" src="js/ui/jquery.ui.sortable.js"></script>
<script language="javascript" type="text/javascript">
$(function(){
$("#s_item").sortable({
items:"li:not(li.not_me)"
});
$("#s_item2").sortable({
cancel:".cancel_me"
});
})
</script>
</head>
<body>
<ul id="s_item" class="connect">
<li>Item 1</li>
<li class="not_me">Item 2 not_me</li>
<li class="not_me">Item 3 not_me</li>
<li class="not_me">Item 4 not_me</li>
<li>Item 5</li>
</ul>
<ul id="s_item2" class="connect">
<li>Item 1</li>
<li class="cancel_me">Item 2 cancel_me</li>
<li class="cancel_me">Item 3 cancel_me</li>
<li class="cancel_me">Item 4 cancel_me</li>
<li>Item 5</li>
</ul>
</body>
</html>
sortable items不让他拖,也不让他放。cancel不然他拖动的更多相关文章
- HTML5 -canvas拖拽、移动 绘制图片可操作移动,拖动
关于canvas 的基础知识就不多说了,可以进这个网址学习 http://www.w3school.com.cn/html5/html_5_canvas.asp 对于canvas 和 SVG 其实一开 ...
- html5 Sortable.js 拖拽排序源码分析
最近公司项目经常用到一个拖拽 Sortable.js插件,所以有空的时候看了 Sortable.js 源码,总共1300多行这样,写的挺完美的. 本帖属于原创,转载请出名出处. 官网http:// ...
- jqueryui sortable拖拽后保存位置
jqueryUI sortable 可以用来进行页面拖拽布局,然而有一个小问题就是拖拽后如何保存状态. 工作中遇到了这个情况,遍把这个问题记了下来,具体思路是: 利用拖拽stop后利用 var a ...
- vuejs2.0使用Sortable.js实现的拖拽功能
简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jquery ui中的sortable.js,只是在拖拽完成后,在update的回调函数中又重新排序了存放数据的数组.但 ...
- vue2.0使用Sortable.js实现的拖拽功能
简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jQuery ui中的sortable.js,只是在拖拽完成后,在update的回调函数中又重新排序了存放数据的数组.但 ...
- vuejs2.0使用Sortable.js实现的拖拽功能( 转)
文章目录 简介 实现效果 html主要代码 css代码 js代码 简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jquery ui中的sortable.js,只是 ...
- jquery sortTable拖拽排序
所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象 ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象 ...
- Jquery.Sorttable 桌面拖拽自定义
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 关于jqueryUI里的拖拽排序
主要参考http://jsfiddle.net/KyleMit/Geupm/2/ (这个站需要FQ才能看到效果) 其实是jqueryUI官方购物车拖拽添加例子的增强版,就是在拖拽的时候增加了排序 这 ...
随机推荐
- 从0开始LInux配置PHP开发环境
主要参考 http://www.cnblogs.com/Fly-sky/p/3770305.html 次要参考 http://www.cnblogs.com/mchina/archive/2012/1 ...
- Ionic.Zip.dll文件压缩和解压
Ionic.Zip.dll文件压缩和解压 下载地址: http://download.csdn.net/detail/yfz19890410/5578515 1.下载Ionic.Zip.dll组件,添 ...
- Alfred工具
神兵利器——Alfred 有人的地方就有江湖,有江湖就有纷争. 很多人说我的文字风格相对轻松和温和,那是因为我很早就认识到,我们没有教育脑残和喷子的义务.在网际多年,看过太多虚拟的刀锋和鲜血,很多人被 ...
- spring实现数据库读写分离
现在大型的电子商务系统,在数据库层面大都采用读写分离技术,就是一个Master数据库,多个Slave数据库.Master库负责数据更新和实时数据查询,Slave库当然负责非实时数据查询.因为在实际的应 ...
- JVM内存管理学习总结(一)
I.JVM进程的生命周期 JVM实例的生命周期和java程序的生命周期保持一致,即一个新的程序启动则产生一个新的JVM进程实例,程序结束则JVM进程实例伴随着消失.那么程序启动和程序终止就是JVM实例 ...
- Android中ListView下拉刷新的实现
ListView中的下拉刷新是非常常见的,也是经常使用的,看到有很多同学想要,那我就整理一下,供大家参考.那我就不解释,直接上代码了. 这里需要自己重写一下ListView,重写代码如下: packa ...
- 机器学习实战kNN之手写识别
kNN算法算是机器学习入门级绝佳的素材.书上是这样诠释的:“存在一个样本数据集合,也称作训练样本集,并且样本集中每个数据都有标签,即我们知道样本集中每一条数据与所属分类的对应关系.输入没有标签的新数据 ...
- 【未来畅想】未来的电信通讯行业,账号密码将取代sim卡
今天看到一条新闻,是关于LG模块化的手机,LG将手机电池模块化了,很多人一片叫好,但是我认为模块化手机无法成为未来的趋势,原因如下:模块化必然要增加手机的卡口.插口增,意味着体积也大大增加,手机正因为 ...
- 一个简单的使用restc demo
最近不经意间看到饿了么团队开发的restc,接口调试工具(类似postman),其实调试接口都没用过工具,每次都只是运行起项目直接调接口.闲来无事,看到restc,就决定试试,后面觉得挺不错的,就分享 ...
- JQuery动态操作表格
新人,小白一枚,刚刚参加工作,所以会在这里记录一些遇到的问题. 最近要做的东西,是对一个表格动态的添加行,删除行,并且对表格中内容进行非空验证. <!DOCTYPE html> <h ...