<!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不然他拖动的更多相关文章

  1. HTML5 -canvas拖拽、移动 绘制图片可操作移动，拖动

    关于canvas 的基础知识就不多说了,可以进这个网址学习 http://www.w3school.com.cn/html5/html_5_canvas.asp 对于canvas 和 SVG 其实一开 ...

  2. html5 Sortable.js 拖拽排序源码分析

    最近公司项目经常用到一个拖拽 Sortable.js插件,所以有空的时候看了 Sortable.js 源码,总共1300多行这样,写的挺完美的.   本帖属于原创,转载请出名出处. 官网http:// ...

  3. jqueryui sortable拖拽后保存位置

    jqueryUI sortable 可以用来进行页面拖拽布局,然而有一个小问题就是拖拽后如何保存状态. 工作中遇到了这个情况,遍把这个问题记了下来,具体思路是: 利用拖拽stop后利用   var a ...

  4. vuejs2.0使用Sortable.js实现的拖拽功能

    简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jquery ui中的sortable.js,只是在拖拽完成后,在update的回调函数中又重新排序了存放数据的数组.但 ...

  5. vue2.0使用Sortable.js实现的拖拽功能

    简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jQuery ui中的sortable.js,只是在拖拽完成后,在update的回调函数中又重新排序了存放数据的数组.但 ...

  6. vuejs2.0使用Sortable.js实现的拖拽功能( 转)

    文章目录   简介 实现效果 html主要代码 css代码 js代码 简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jquery ui中的sortable.js,只是 ...

  7. jquery sortTable拖拽排序

    所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象   ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象   ...

  8. Jquery.Sorttable 桌面拖拽自定义

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  9. 关于jqueryUI里的拖拽排序

    主要参考http://jsfiddle.net/KyleMit/Geupm/2/  (这个站需要FQ才能看到效果) 其实是jqueryUI官方购物车拖拽添加例子的增强版,就是在拖拽的时候增加了排序 这 ...

随机推荐

  1. 里氏替换原则LSP（继承规范）

    继承的优点: 1.代码共享,减少创建类的工作量,每个子类都拥有父类的方法和属性. 2.提高代码的重用性. 3.子类可以形似父类,但又异于父类. 4.提高代码的可扩展性,实现父类的方法就可以“为所欲为” ...

  2. Android ListView中添加不同的多种布局

    最近做项目要使用ListView加载不同的布局,由于自己写的代码不能贴出,故找了一篇自认为比较好的blog给分享出来,希望对用到此项技术的同学有点帮助. http://logc.at/2011/10/ ...

  3. VS 2012 单元测试简单配置

    写算法时大多依靠简单输入验证,经常遇到小范围输入正常,大范围或特殊情况输入结果错误的问题.所以写程序之前最好先想好几个特殊用例来测试,以验证算法是否正确.单元测试就是个不错的工具,而VS 2012提供 ...

  4. 结构-行为-样式-Js排序算法之 快速排序

    快速排序算法,是我的算法系列博客中的第二个Js实现的算法,主要思路:    在一个数组中随机取一个数(一般都取第一个或者最后一个),使这个数与数组中其他数进行比较,如果比它大就放到它的右边,比它小就放 ...

  5. 用php 进行对文件的操作 （上）

    如何让自己磁盘中的文件夹和目录显示在网页上?那就来看一下,用php是怎么来操作他们的吧 php中文件,一般包含两块内容,文件和目录 先来一句一句的看代码,及他的作用 运行后看一下结果 file 指的是 ...

  6. Linux编程之UDP SOCKET全攻略

    这篇文章将对linux下udp socket编程重要知识点进行总结,无论是开发人员应知应会的,还是说udp socket的一些偏僻知识点,本文都会讲到.尽可能做到,读了一篇文章之后,大家对udp so ...

  7. 《如何阅读一本书》（How to Read a Book）

    值得一读的书,有深入浅出,也有并不能完全读懂的部分,以下是第11章对之前内容的总结整理. 阅读的层次 1. 基础阅读 2. 检视阅读 3. 分析阅读 4. 主题阅读 分析阅读 第一阶段:这本书在谈些什 ...

  8. JMeter在Linux系统中的环境变量配置

    下载: 在线下载jmeter(或者本地上传): wget http://mirrors.tuna.tsinghua.edu.cn/apache//jmeter/binaries/apache-jmet ...

  9. FragmentTransation中的remove和detach有什么区别？

    remove(): 从Activity中移除一个Fragment,如果被移除的Fragment没有添加到回退栈(回退栈后面会详细说),这个Fragment实例将会被销毁; detach(): 会将vi ...

  10. Factory Pattern(工厂模式)

    1.工厂模式简介 工厂模式,专门负责将大量有共同接口的类实例化(用来生产对象).其定义为定义一个用于创建对象的接口,让子类决定实例化那一个类.工厂方法使一个类的实例化延迟到其子类. 工厂模式拥有以下几 ...