jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery插件 – wordpress菜单创建者大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这只是一个简单的问题,有没有人知道一个 jquery插件,它复制与wordpress菜单创建者相同的动作,而你可以拖放菜单项,并稍微拖动到右边缩进作为上述链接的孩子?我到处寻找(我知道它是使用jquery UI制作的),但无法找到任何将其包装成插件的人.

问候

编辑

这就是我到目前为止……感谢任何帮助.

$( ".connectSortable" ).sortable({

        placeholder: "ui-state-highlight",connectWith: ".connectedSortable",items: "li:not(.ui-state-disabled)",Helper : 'clone',beforeStop : function(event,ui) {
            var dist = 25;
            var placeholder = $('.ui-state-highlight');
            var currentDepth = placeholder.attr('depth');
            ui.item.css({ 'margin-left' : (currentDepth*dist) + 'px' }).attr('depth',currentDepth);
        },stop : function(event,ui) {
            var child = ui.item;
            var parent = child.prev();
            var parentId = parent.attr('child');
            child.attr('parent',parentId);
        },sort: function(event,ui) {

            if( $('.ui-sortable-Helper').length != 0 ) {

                // get dragable object
                var moveable = $('.ui-sortable-Helper');

                // get the place holder for this object
                var placeholder = $('.ui-state-highlight');

                // find out the offset when draging
                var moveabLeoffset = moveable.offset();

                // find the placeholder offset
                var placeholderOffset = placeholder.offset();

                // get the left offset for both
                var moveableLeft = moveabLeoffset.left;
                var placeholderLeft = placeholderOffset.left;

                // set how many pixels to the right you want the indent when pushed as a child
                var dist = 25;

                // when dragging,if the draggable is more than the pixels set to go to the right than the placeholder...
                if( ( moveableLeft - placeholderLeft ) > dist ) {

                    // find the parent element
                    var parent = placeholder.prev();

                    // if the dragged element has not get been assigned a depth (no parent by default)
                    if( typeof moveable.attr('depth') !== 'undefined' ) {
                        // get the draggable object's current depth
                        var thisDepth = moveable.attr('depth');
                    }else{

                        // if the dragged element has not been assigned a depth (no parent by default),set to 0
                        var thisDepth = 0;
                    }

                    // if the parent has been set a depth
                    if( typeof parent.attr('depth') !== 'undefined' ) {

                        // get the parents current depth
                        var currentDepth = parent.attr('depth');
                            currentDepth = ( currentDepth == '' ? '0' : currentDepth );

                        // find out the placeholders current margin set
                        var currentMargin = number(placeholder.css('margin-left').replace('px',''));

                        // work out the new margin
                        var newMargin = ((number(currentDepth)+1)*number(dist));

                        // move the placeholder so when/if the user releases it is Now a child of the above
                        placeholder.attr('depth',(number(currentDepth)+1)).css({ 'margin-left' : newMargin + 'px' });
                    }else{
                        placeholder.attr('depth','1').css({ 'margin-left' : dist+'px' });
                    }
                }else{
                    // if not,lets go BACkWARDs
                    var parent = placeholder.prev();
                    if( typeof parent.attr('depth') != 'undefined' ) {
                        var currentDepth = parent.attr('depth');
                        currentDepth = ( currentDepth == '' ? '0' : currentDepth );
                        if( currentDepth != '0' ) {
                            placeholder.attr('depth',(number(currentDepth)-1)).css({ 'margin-left' : ((number(currentDepth)-1)*number(dist)) + 'px' });
                        }
                    }else{
                        placeholder.attr('depth','0').css({ 'margin-left' : '0' });
                    }
                }
            }
        }
    });

HTML示例:

<ul class="connectedSortable connectSortable sortables ui-sortable" id="sortable2"> 
<li id="post-id-1" child="1" parent="0" class="ui-state-default posty">Test 1</li>
<li id="post-id-2" child="2" parent="0" class="ui-state-default posty">Test 2</li>  
<li id="post-id-5" child="5" parent="0" class="ui-state-default posty">Test 3</li>  
<li id="post-id-3" child="3" parent="0" class="ui-state-default posty">Test 4</li>  
<li id="post-id-4" child="4" parent="0" class="ui-state-default posty">Test 5</li>  
</ul>

解决方法

如果你还在寻找,我想我发现了这样一个插件.

http://mjsarfatti.com/sandbox/nestedSortable/

尚未尝试过,但即将做到这一点.

大佬总结

以上是大佬教程为你收集整理的jquery插件 – wordpress菜单创建者全部内容,希望文章能够帮你解决jquery插件 – wordpress菜单创建者所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。