首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

子li不会使用jquery sortable与父ul一起移动

是指在使用jquery sortable插件时,子li元素无法与父ul元素一起移动。下面是一个完善且全面的答案:

jquery sortable是一个用于创建可排序列表的插件,它允许用户通过拖拽来重新排序列表中的元素。然而,当子li元素与父ul元素一起移动时,可能会遇到一些问题。

这个问题可能是由于jquery sortable插件的默认行为导致的。默认情况下,jquery sortable插件只会对同一个父元素下的子元素进行排序,而不会跨父元素进行排序。因此,当子li元素与父ul元素一起移动时,jquery sortable插件无法正确地处理排序操作。

解决这个问题的方法是使用jquery sortable插件的选项进行配置。可以通过设置"connectWith"选项来指定可排序的父元素,使得子li元素可以与父ul元素一起移动。具体的配置代码如下:

代码语言:javascript
复制
$(function() {
  $("ul").sortable({
    connectWith: "ul"
  }).disableSelection();
});

在上述代码中,我们通过设置"connectWith"选项为"ul",告诉jquery sortable插件可以将子li元素与其他ul元素进行连接,从而实现子li元素与父ul元素一起移动的效果。

推荐的腾讯云相关产品和产品介绍链接地址:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

(长文预警) 你还在烦工作中碰到的拖拽问题?一个框架jiejue

Sortablejs 简介 Sortable —是一个JavaScript库,用于在现代浏览器和触摸设备上对拖放列表进行重新排序。无需jQuery。...delayOnTouchOnly 选项 是否仅在用户使用触摸(例如,在移动设备上)时才应用延迟。在任何其他情况下,都不会延迟。...delay设置此选项后,即使手指不动,某些具有非常灵敏的触摸显示屏的手机(如三星Galaxy S8)也会触发不需要的触摸移动事件,从而导致排序不会触发。...仅当您将指针移过一定的公差时才开始拖动,这样您就不会在每次单击时意外开始拖动。 3到5可能是不错的值 dragoverBubble 选项 如果设置为true,则拖动事件将冒泡到可排序对象。...默认情况下为false,但是Sortable仅在将元素插入Sortable或可以插入Sortable时才停止冒泡事件,但不在特定时间(由于动画等) 。

7.1K10
  • jQuery

    ’) li标签下的类名为nj的选择器 层级选择器 子代选择器 $(‘ul>li’) 后代选择器 $(‘ul li’)过滤选择器 这类选择器都带冒号 :eq(index) $(“li:eq...);//谁调用了mouseover,然后this就是谁,且this是dom对象,使用jquery需要转换为jquery对象 }) mouseover 事件在鼠标移动到选取的元素及其元素上时触发 mouseenter...事件只在鼠标移动到选取的元素上时触发 以后如果有鼠标移入事件,请使用mouseenter,而不是mouseover 鼠标离开事件使用mouseleave,而不是mouseout 案例-突出显示 案例...那么, (1).如果子类的 成员变量类的 成员变量 的类型及名称都相同,则用sTest访问时,访问到的是子类的成员变量;用pTest访问时,访问到的是类的成员变量; (2).如果子类的静态成员变量类的静态成员变量的类型及名称都相同....用sTest调用未覆盖的类成员方法时,该方法中如果使用到了被隐藏的变量或方法时,规则同上; jQuery background-color 和 backgroundColor 入口函数 $(document

    1.1K20

    jQuery基础(五)一Ajax应用常用插件-imooc

    如下图所示: 自定义对象级插件——lifocuscolor插件 自定义的lifocuscolor插件可以在元素中,鼠标在表项元素移动时,自定义其获取焦点时的背景色,即定义元素选中时的背景色...,options为调用方法时的配置对象, 例如,在页面中,通过加载sortable插件将元素中的各个表项实现拖曳排序的功能,如下图所示: 在浏览器中显示的效果: 3-4面板折叠插件—...例如,将三个元素工具提示插件相绑定,当把鼠标移动在元素内容时,以动画效果弹出对应的提示图片,移出时,图片自动隐藏,如下图所示: 元素中,鼠标在列表项元素移动时,可以自定义其获取焦点(focus)时的背景颜色,即设置表项元素选中时的背景色....> 第1个LI 第2个LI 第3个LI

    16.5K20

    Python全栈之jQuery笔记

    >li") 使用>号,获取儿子层级的元素,注意:并不会获取孙子层的元素 后代选择器 $("ul li") 使用空格,代表后代选择器,获取ul下的所有的li...$('#ul1 li:gt(2)') 选择id为ul1元素下的前三个之后的li :lt $('#ul1 li:lt(2)')...$("span").parentsUntil("div"); 返回介于 元素之间的所有祖先元素(不包含div元素). 2.jQuery遍历-后代 后代是、孙、曾孙等等...jQuery对象,可链式调用: $('#div1') // id为div1的元素 .children('ul') //该元素下面的ul元素...前端性能优化分为如下几个方面: 一、代码部署: 1、代码的压缩合并 2、图片、js、css等静态资源使用和主站不同域名地址存储,从而使得在传输资源时不会带上不必要的cookie信息.

    5.5K40

    jquery选择器用法_jQuery属性选择器

    (可以是ID选择器、元素选择器或是类名选择器)组合在一起,两个选择器之间以逗号”,”分隔,只要符合其中的任何一个筛选条件就会被匹配,返回的是一个集合形式的jQuery包装集,利用jQuery索引器可以取得集合中的...2. parent>child选择器 parent>child选择器中的parent代表元素,child代表元素,用于在给定的元素下匹配所有的元素,使用该选择器只能选择元素的直接元素...示例:(“ul li:first-child”) //匹配ul元素中的第一个元素li :last-child...说明:匹配所有给定元素的最后一个元素 示例:(“ul li:last-child”) //匹配ul元素中的最后一个元素li...:only-child 说明:如果某个元素是它元素中唯一的元素,那么将会被匹配,如果元素中含有其他元素,则不会被匹配 示例:(“ul

    12.2K30

    一文入门jQuery

    文章目录 jQuery概念 快速入门 步骤: JQuery对象和JS对象区别转换 选择器:筛选具有相似特征的元素(标签) 基本操作学习 事件绑定 入口函数 样式控制:css方法 分类 基本选择器...案例 全选和全不选 QQ表情选择 多选下拉框左右移动 jQuery概念 一个JavaScript框架。简化JS开发。...除非特殊要求, 一般不会使用3.x版本的,很多老的jQuery插件不支持这个版本。 目前该版本是官方主要更新维护的版本。...最新版本:3.2.1(2017年3月20日) jquery-xxx.js jquery-xxx.min.js区别: jquery-xxx.js:开发版本。给程序员看的,有良好的缩进和注释。...程序加载更快 导入JQuery的js文件:导入min.js文件 使用 var div1 = $(“#div1”); alert(div1.html()); JQuery对象和JS对象区别转换 JQuery

    3.5K20

    JQuery高级

    jQuery中定义变量的时候,一般命名用$开头。同事一看就知道是使用jQuery,然后使用jQuery的语法。 其实$是jQuery中的一个函数。...***事件冒泡 现象:父子级标签 触发级的事件,这个事件会逐层向级传递。 子集执行了某一事件,会逐层向上触发相同事件,直到被处理或者遇到return。...比如级有单击事件,那么级如果有单击事件也会被触发,级的级如果有单击事件也会被触发。 任何一个操作,计算机或者浏览器都会去处理。不管你有没有设置对应的事件。...(:最近的能包含住将来发生事件的所有级)------ 事件代理 .delegate(真实发生事件的目标,字符串事件属性,匿名函数去写命令function(){}) 工作中有可能会有人用这个词on()...共计10个函数而已: 控制顺序------移动节点-------- 下面的函数,如果没有节点,那么会新增对应的节点,如果有这个节点,那么就会移动相对应的节点。所以此处没有任何函数需要学习。

    1.5K50

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭
      领券