1

这可能很容易，但我无法弄清楚......

我正在尝试动态构建模态通知窗口，其结构为：

<!-- the overlay to disable the screen interaction -->
<div id="modalWrapper"></div>

<!-- the actual window where I put the contents in dynamically -->
<div id="modalWindow"></div>

我正在使用 JQuery 构建的结构是：

<h1>Error</h1><h5>test</h5><ul class="buttons"><li class="left"><a class="button red small">Close</a></li></ul>

我也在动态附加一个事件处理程序：

a.bind('click', function() {
    // hide wrapper and modal
    $('#modalWindow').hide();
    $('#modalWrapper').hide();
    callback();
});

回调函数作为对构建模式窗口的函数的引用传递。

当我调用“显示”功能时 - 它会构建窗口并显示它，但它只能工作一次。对它的任何连续调用都失败了

$('#modalWindow').empty();

无法移除绑定了事件的元素（即节点）。

我试过了：

$('#modalWindow').empty();
$('#modalWindow').remove();
$('#modalWindow a').each(function(index, item) { $(item).unbind('click');});
$('#modalWindow a').each(function(index, item) { $(item).remove();});

并且所有这些都失败并显示相同的错误消息：

TypeError: handleObj is undefined
()jquery-1.7.2.js (line 3057)
()jquery-1.7.2.js (line 6524)
()jquery....min.js (line 9)
()jquery-1.7.2.js (line 5906)
()xxxxxxxxxxx.js (line 392)
()xxxxxxxxxxx.js (line 282)
[Break On This Error]   

if ( ( mappedTypes || origType === handleObj.origType ) && jquery-1.7.2.js (line 3057

有人可以阐明如何清空#modalWindow，以便在下一次通知时再次填充它吗？

我已经用这个复制了这个问题：

var x = $('<a/>').html('clickme').attr('id','some_id').bind('click',function() {$(this).remove();});
$('body').append(x);

但是请注意，上面的单行错误带有相同的消息，但我的应用程序中的实际执行流程不同。我正在构建所有 HTML 并绑定一个“隐藏”模式元素的事件。然后在下一次迭代中，我试图“清空”模态容器并在其中“插入”新项目，这就是它出错的地方——所以我没有删除包含当前正在执行的处理程序的项目。我试图在下一次迭代中删除它。

提前致谢。

另一个更新 - 仅供参考 似乎 JQuery 的事件调度程序或它周围的一些代码中可能存在错误。

Object.prototype.someFunctionName = function(param) {
   alert('test');
}
var x = $('<a/>').html('clickme').attr('id','some_id').bind('click',function() {$(this).remove();});
$('body').append(x);

导致每次在任何元素上触发“click”时都会执行 someFunctionName，并且参数不匹配会导致 JQuery 阻塞并出错。

如果我们这样定义 someFunctionName ：

Object.prototype.someFunctionName = function() {
   alert('test');
}
var x = $('<a/>').html('clickme').attr('id','some_id').bind('click',function() {$(this).remove();});
$('body').append(x);

它有效，但每次仍然执行 - 这是错误的......我将在 JQuery 的网站上发布 - 谢谢大家。

作品：http: //jsfiddle.net/tinnerdxp/AU4pm/

不起作用：http: //jsfiddle.net/tinnerdxp/Pvax2/

tinnerdxp

4

1 回答 1

0

tinnerdxp的回答：

谢谢大家，最后是我的代码。我已经像这样扩展了 Object.prototype：

Object.prototype.isSet = function(property) {
    if (!(property in this)) {
        return false;
    } else {
        return true;
    }
}


Object.prototype.isArray = function() {
    if (this.constructor.toString().indexOf('Array') == -1) {
        return false;
    } else {
        return true;
    }
}

第一个扩展实际上是在破坏它。这有点奇怪：

  • JQuery 没有在任何地方使用 .isSet - 所以我没有覆盖任何核心功能
  • 将 isSet 重命名为 amIset 之类的愚蠢的东西 - 仍然没有修复它
  • 删除 isSet - 尽管我仍然有 .isArray() ，但已修复它 - 并且它与剩下的那个一起工作正常。

我在上面放置的复制代码 - 当我执行我的库（和扩展）时确实不起作用 - 所以在这里发布它是错误的。

不过一般来说：

  • 感谢 Blazemonger 的建议让我做出了决定
  • Anthony - 这也是一个非常好的指针 - 因为我最初怀疑范围问题。

多谢你们。

于 2012-08-03T08:37:21.710 回答