Javascript 为什么此事件仅绑定到与选择器匹配的一个元素?

Javascript 为什么此事件仅绑定到与选择器匹配的一个元素?,javascript,jquery,javascript-events,Javascript,Jquery,Javascript Events,我有一小段jQuery,它应该在每个元素进入视图时将一个一次性事件绑定到与选择器匹配的元素: jQuery(document).ready(function($) { if (jQuery.browser.mobile === false) { $('.featureswrap img.left').css('opacity', 0).one('inview', function(isInView) { if (isInView) {$(t

我有一小段jQuery,它应该在每个元素进入视图时将一个一次性事件绑定到与选择器匹配的元素:

jQuery(document).ready(function($) {   
    if (jQuery.browser.mobile === false) {
         $('.featureswrap img.left').css('opacity', 0).one('inview', function(isInView) {
            if (isInView) {$(this).addClass('animated fadeInLeftBig delayp1');}
        });
        $('.featureswrap img.right').css('opacity', 0).one('inview', function(isInView) {
            if (isInView) {$(this).addClass('animated fadeInRightBig delayp1');}
        });
    }
});
但是,每个选择器似乎只绑定到页面上的一个看似随机的元素,所以总共有两个元素。起初我以为我是误会了。一个,但我不认为是这样。CSS函数对与选择器匹配的每个元素都能正常工作,但inView事件只绑定到每个选择器的一个元素。也许这是我的误解,或者完全是别的什么


在此提供一些帮助将不胜感激。页面不会抛出任何错误,否则会按预期工作。没有任何类型的JavaScript会干扰事件绑定,甚至不会与相同元素交互。

通过使用.each将事件附加到每个元素,解决了此问题。以下是更新后的工作代码:

jQuery(document).ready(function($) {
    if (jQuery.browser.mobile === false) {
        $('.featureswrap img.left').each(function(index){
            $(this).css('opacity', 0).one('inview', function(isInView) {
                if (isInView) {$(this).addClass('animated fadeInLeftBig delayp1');}
            });
        });
        $('.featureswrap img.right').each(function(index){
            $(this).css('opacity', 0).one('inview', function(isInView) {
                if (isInView) {$(this).addClass('animated fadeInRightBig delayp1');}
            });
        });
    }
});

您正在使用中的哪个插件提供inview?请创建一个例子。我已经解决了这个问题,请看下面的答案,但是这个插件非常方便,我推荐它。