3

我有一个自己无法解决的问题。我调试了几天，但没有成功找到问题所在。

我有一个 selected.js + jscrollpane.js。When a chosen is open, the search input field must to be focused to write some search string. 我第一次打开所选内容时会引发错误，并且我无法在其中搜索任何内容。但是，如果我关闭选择并重新打开它，一切正常。

我为你做了一个小提琴：http: //jsfiddle.net/y2h3ohr3/2/

所以当我第一次打开选择的错误时，我可以在 Chrome 的控制台中看到这个错误（在 firefox 中，错误存在但控制台不会抛出错误）：

Uncaught NotFoundError: 无法在 'Node' 上执行 'appendChild': 要移除的节点不再是该节点的子节点。也许它是在“模糊”事件处理程序中移动的？

控制台抛出的跟踪：

jQuery.extend.buildFragment @ jquery-1.9.1.js:6541

jQuery.fn.extend.domManip @ jquery-1.9.1.js:6129

jQuery.fn.extend.append @ jquery-1.9.1.js:5949

初始化@jquery.jscrollpane.min.js:115

JScrollPane@jquery.jscrollpane.min.js:1388

（匿名函数）@jquery.jscrollpane.min.js:1407

jQuery.extend.each @ jquery-1.9.1.js:648

jQuery.fn.jQuery.each @ jquery-1.9.1.js:270

$.fn.jScrollPane@jquery.jscrollpane.min.js:1399

（匿名函数）@ selected.jquery.js:774

jQuery.event.dispatch @ jquery-1.9.1.js:3074

elemData.handle @ jquery-1.9.1.js:2750

jQuery.event.special.focus.trigger@jquery-1.9.1.js:3256

jQuery.event.trigger@jquery-1.9.1.js:2952

（匿名函数）@jquery-1.9.1.js:3677

jQuery.extend.each @ jquery-1.9.1.js:648

jQuery.fn.jQuery.each @ jquery-1.9.1.js:270

jQuery.fn.extend.trigger@jquery-1.9.1.js:3676

jQuery.fn.（匿名函数）@ jquery-1.9.1.js:7403

$.fn.extend.focus@jquery-ui.js:230

Chosen.results_show@chosen.jquery.js:968

Chosen.container_mousedown @ selected.jquery.js:839

（匿名函数）@ selected.jquery.js:654

jQuery.event.dispatch @ jquery-1.9.1.js:3074

elemData.handle @ jquery-1.9.1.js:2750

我做了一个小提琴，它的设计与我的项目中的不同，但错误完美再现（第一次打开时请注意 chrome 控制台选择）。

你可以在这里查看小提琴：

http://jsfiddle.net/y2h3ohr3/2/

谁能帮我？我被困住了，我不能做更多，因为我在任何地方都没有发现错误。错误是 jquery 抛出的，而不是选择的，所以我没有自定义appendChild。

4

2 回答 2

2

发生这种情况是因为在您的小提琴中的第 115 行：

pane = $('<div class="jspPane" />').css('padding', originalPadding).append(elem.children());

您尝试将 elem.children() 附加到窗格中，但是当您在选择子项中选择某些内容时，您的 elem 会发生变化。因此 jQuery 尝试删除并添加一个不再存在的子项。一个快速的解决方案是克隆 elem.children，将它们存储在 var 中并附加克隆的孩子。像这样：

var $children = elem.children().clone();
                    pane = $('<div class="jspPane" />').css('padding', originalPadding).append($children);

更新的小提琴

于 2015-11-10T11:59:58.523 回答
1

问题似乎在以下行： pane = $('<div class="jspPane" />').css('padding', originalPadding).append(elem.children());

而不是append它应该被添加到现有元素中。 appendTodiv.jsPanepane = $('<div class="jspPane" />').css('padding', originalPadding).appendTo(elem.children());

在这里查看jsFiddle

于 2015-11-10T08:38:22.830 回答