0

我决定在一个项目中使用 NicEdit，因为它是轻量级的。

所以，现在我的页面中有可变数量的实例，在点击时加载并在编辑器模糊时删除。

我需要知道如何从这个组件中解除绑定事件。我试图手动解除绑定，但我不明白它们的链接位置！

$('.container').bind('click', function(){
    var _form = $(this).parentsUntil('form').parent();
    var textarea = _form.find('textarea.edit');
    var ta_id = textarea.attr('id');
    var ed = new nicEditor(niceditOptions).panelInstance(ta_id);

    // Show Preview and update textarea and so on
    ed.addEvent('blur', function() {
        var _ed = nicEditors.findEditor(ta_id);
        var ev_type, evt, events = this.eventList;

        for (ev_type in events){
            for (evt in ev_type){
                if (this.removeEventListener){
                    this.removeEventListener(ev_type, events[ev_type][evt]);
                }
                else {
                    this.detachEvent('on' + ev_type, events[ev_type][evt]);
                }
            }
        }
        this.removeInstance(ta_id);
    });
            
});
4

1 回答 1

0

可能有其他方法可以解决您的解决方案，但在这种情况下，我更喜欢使用nicEditor 面板的一个版本并绑定我所有的所见即所得实例。这样做的原因是我认为它稍微整洁一些。我假设您知道如何将一个编辑器绑定到多个可编辑实例。

加载时，我的 HTML 可能看起来像这样：

<div id="instance1">text</div>
...
<div id="instance2">text</div>
...
<div id="myNicPanel" style="display:none;position:relative;"></div>

所以，一旦页面完成了它的加载周期，我应该有两个可编辑区域和一个隐藏的编辑器。然后，我将使用以下jQuery重新定位并在选择实例以进行编辑时显示编辑器：

        $('#instance1 , #instance2').click(function () {
         //Reposition the editor to just above the selected instance
            $('#myNicPanel').css({
                top: $(this).position().top,
                left: $(this).position().left,
                display: 'block',
                width: $(this).width() - 2 //manual adjustment,
                position: 'absolute'
            });
         //Make the width of the editor equal to that of the instance
            $('#myNicPanel').css({
                top: $(this).position().top - $('#myNicPanel').height()
            });
        });

您当然已经在此之前启动了您的编辑器和实例，如果您还想让编辑器在模糊时再次隐藏，您可以将您的hide()函数附加到nicEditor 事件之一。

于 2012-10-19T07:47:59.913 回答