【问题标题】:JavaScript clone doesn't workJavaScript 克隆不起作用
【发布时间】:2015-02-17 20:41:40
【问题描述】:

看看这个 jsfiddle https://jsfiddle.net/3o38nbzs/4/ 当我克隆时,我可以移动克隆,但它不会“听”点击。 https://jsfiddle.net/L5mg87jm/我克隆的时候,克隆是静态的。

一开始我用的是clone()和第二个clone(true,true),这是唯一的区别。

如何创建一个克隆来响应点击事件?

基本上,我无法知道用户何时单击克隆对象。我尝试使用克隆(真,真),但它仍然失败。 当我使用 .clone() 时,我可以移动拖动对象,但单击不起作用。 当我使用 .clone(true,true) 时,没有任何效果。

        // Clone Block
        function cloneblock(obj, event, ui) {
            var idn = Math.floor((Math.random() * 100) + 1), idt = '#' + idn;
            if (obj) {
                var block = $(selected).clone();
                block.css({ left: mouse.X + 'px', top: mouse.Y + 'px' }).attr('id', idn).removeClass('ui-draggable selected');
            } else {
                var block = $(ui.draggable).clone();
                block.css({ left: mouse.X + 'px', top: mouse.Y + 'px' }).attr('id', idn).removeClass('ui-draggable selected gblock').addClass('block');
            }
            block.children('.ui-widget-content').children('p').children('.vertexout').attr('id', 'vo' + idn);
            var exit = block.children('.ui-widget-content').children('p').children('.vertexout');
            if ($(exit).hasClass('image')) {
                $(exit).attr('id', 'v' + idn + 4);
                jsPlumb.makeSource($(exit), {
                    scope: 'image'
                });
            } else if ($(exit).hasClass('int')) {
                $(exit).attr('id', 'v' + idn + 5);
                jsPlumb.makeSource($(exit), {
                    scope: 'int'
                });
            } else if ($(exit).hasClass('float')) {
                $(exit).attr('id', 'v' + idn + 6);
                jsPlumb.makeSource($(exit), {
                    scope: 'float'
                });
            } else {
                $(exit).attr('id', 'v' + idn + 7);
                jsPlumb.makeSource($(exit), {
                    scope: 'char'
                });
            }
            var vin2 = block.children('.ui-widget-content').children('p').children('.vertexin');
            for (i = 0; i < vin2.length; i++) {
                if ($(vin2[i]).hasClass('image')) {
                    $(vin2[i]).attr('id', 'v' + idn);
                    jsPlumb.makeTarget($(vin2[i]), {
                        maxConnections: 1,
                        scope: 'image'
                    });
                } else if ($(vin2[i]).hasClass('int')) {
                    $(vin2[i]).attr('id', 'v' + idn + 1);
                    jsPlumb.makeTarget($(vin2[i]), {
                        maxConnections: 1,
                        scope: 'int'
                    });
                } else if ($(vin2[i]).hasClass('float')) {
                    $(vin2[i]).attr('id', 'v' + idn + 2);
                    jsPlumb.makeTarget($(vin2[i]), {
                        maxConnections: 1,
                        scope: 'float'
                    });
                } else {
                    $(vin2[i]).attr('id', 'v' + idn + 3);
                    jsPlumb.makeTarget($(vin2[i]), {
                        maxConnections: 1,
                        scope: 'char'
                    });
                }
            }
            block.appendTo($(container));
            jsPlumb.draggable($(idt), dragop);
            resize();
        } 

【问题讨论】:

  • 那是很多的代码。您能否将范围缩小到与重新创建问题中的问题相关的部分。
  • 并且,请修复您的代码以正确缩进,因为它不是很可读。您始终可以使用 jsbeautifier.org 之类的东西来修复缩进。

标签: javascript jquery jquery-ui jsplumb


【解决方案1】:
 var block = $(selected).clone();

clone()shallow 副本。通常,绑定到原始元素的任何事件处理程序都不会复制到克隆。

您必须使用clone(true),它也会复制所有事件。

【讨论】:

  • 我知道,举一个克隆(true)的例子和一个克隆()的例子。正如我上面所说,当使用 clone () jsfiddle.net/3o38nbzs/4 时,使用 clone (true) jsfiddle.net/L5mg87jm 时拖动不起作用。谢谢
猜你喜欢
  • 2012-05-02
  • 1970-01-01
  • 2011-06-25
  • 2016-09-08
  • 2013-06-12
  • 2018-12-12
  • 1970-01-01
  • 1970-01-01
  • 2012-12-21
相关资源
最近更新 更多