javascript - .bind( ) Javascript 在 Firefox 和 IE 中不起作用？

Question

我有一个 div，单击它会向右移动，然后再次单击它会返回到左侧(它是一个时事通讯弹出窗口)。一切都在 Safari 和 Chrome 中完美运行，但是在 Firefox 和 IE 中它只会打开，当您再次单击时它不会关闭。我正在使用 .bind() 和 .unbind() 有什么建议么？我正在使用 jQuery 版本 1.3.2。

FF 错误:NS_ERROR_XPC_BAD_CONVERT_JS:无法转换 JavaScript 参数 arg 0 [nsIDOMWindow.getComputedStyle]

IE 错误:SCRIPT16386:不支持此类接口(interface)

Javascript:

$(function () {
    $('.newsletter').bind('click.open', open)
    $(window).resize(function () {
        var wWth = $(window).innerWidth(),
            wHgt = $(window).innerHeight();
        $('#overflow').fadeIn('slow').css({
            width: wWth,
            height: wHgt
        });
    });
});

function open() {
    var overflow = $('<div id="overflow"><div>');
    $(this).stop().animate({
        left: '-35'
    }, 650);
    if ($('#overflow').length < 1) {
        $('body').append(overflow);
    }
    var wWth = $(window).innerWidth(),
        wHgt = $(window).innerHeight();
    $('#overflow').fadeIn('slow').css({
        width: wWth,
        height: wHgt
    });
    $('.newsletter').unbind('click.open').bind('click.close', close)
}

function close(e) {
    if ($(e.target).is('input')) return;
    $('#overflow').fadeOut('slow')
    $('.newsletter').stop().animate({
        left: '-390px'
    }, 650);
    $('.newsletter').unbind('click.close').bind('click.open', open)
}

HTML

<div class="newsletter_signup">
<div id="newslettertext1">
    Newsletter bestellen<br>
    <br>
    Lassen Sie sich per Newsletter &#252;ber Neuheiten und <br>
    Aktionen von Tempur informieren. Jetzt anmelden
</div>
<div id="signup">
    <form id="leftnewsletter" action="" method="get">
    <input type="email" name="email" id="emailsignup" placeholder="E-MAIL ADDRESS" style="margin-left:76px; margin-top:16px; width:187px;">
    <input type="submit" name="signupbtn" id="signupbtn" value="SIGN UP" class="signupbutton">
</form>
</div>
<div id="newslettertext2">
    *Sie k&#246;nnen jederzeit Ihre Einwilligung zum Erhalt des<br>
Newsletters zur&#252;ckziehen und sich abmelden.
</div>

Answer 1

从 jQuery 1.7 开始，.on() 方法是将事件处理程序附加到文档的首选方法。

有detailed post在过去讨论它。

简而言之，保留.bind()只是为了兼容性的目的，我们应该忘记它并使用更灵活的.on()。

对于您的问题，将您的 bind() 语句更改为:

$('.newsletter').bind('click.open', open)

进入:

$(document).on('click', '.newsletter', open);

---

更新:

由于您使用的是非常早期的 jQuery 版本，我想您最好的选择是使用 .noConflict 将两个版本一起加载。自 1.3 以来，jQuery 发生了很大变化。您可能会犹豫是否升级是可以理解的，因为您的旧代码可能使用了一些旧功能，例如浏览器检测等。

所以这里是你如何做的:

jqNew = jQuery.noConflict( true );

然后您将使用 jqNew(document).on(event, selector, function); 或其他任何方式来绑定(bind)您的事件。旧代码将继续使用 $.xxx。

有一个例子here .将该页面向下滚动到以下部分:示例:加载两个版本的 jQuery(不推荐)。然后，将 jQuery 的全局范围变量恢复为第一个加载的 jQuery。