Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/396.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript jQuery在firefox和opera中部分不工作_Javascript_Jquery_Firefox_Opera_Mozilla - Fatal编程技术网

Javascript jQuery在firefox和opera中部分不工作

Javascript jQuery在firefox和opera中部分不工作,javascript,jquery,firefox,opera,mozilla,Javascript,Jquery,Firefox,Opera,Mozilla,我正在浏览器中测试我的网页,似乎有些东西在firefox和opera中不起作用。我想这是由我的页面上使用的jQuery造成的 这是我的网站: 在源代码的底部,您可以找到所有使用的jQuery代码(主要用于调用和应用插件)。我很难确定是什么问题,因为控制台(firefox 20.0)中没有显示错误,主要的功能失调是 播放器,只需比较它在chrome中的工作方式,然后在firefox或opera中查看它,首先它不会显示“…”这表示加载,其次,一旦你在另一个播放器上单击播放,两首歌曲都会继续播放,就像

我正在浏览器中测试我的网页,似乎有些东西在firefox和opera中不起作用。我想这是由我的页面上使用的jQuery造成的

这是我的网站:

在源代码的底部,您可以找到所有使用的jQuery代码(主要用于调用和应用插件)。我很难确定是什么问题,因为控制台(firefox 20.0)中没有显示错误,主要的功能失调是

  • 播放器,只需比较它在chrome中的工作方式,然后在firefox或opera中查看它,首先它不会显示“…”这表示加载,其次,一旦你在另一个播放器上单击播放,两首歌曲都会继续播放,就像在其他浏览器中一样,第一首歌曲会暂停,因此只有一首歌曲播放

  • 广告应该有jQuery计算的顶部和底部的边距,opera和firefox中没有。 我是不是错过了什么?也许我需要应用某些代码标准

  • 似乎就这些,但我不能确定

    我将把自己编写的代码放在这里(最有可能的问题是它),注意,上面包含了几个jQuery插件

    <script type="text/javascript">
    
    //Audio Player
    audiojs.events.ready(function () {
        var as = audiojs.createAll();
    
            $('audio').each(function () {
                var myAudio = this;
                this.addEventListener('play', function () {
                    $('audio').each(function () {
                        if (!(this === myAudio)) {
                            this.pause();
                        }
                });
            });
        });
    });
    
    $(document).ready(function() {
    
        //Responsive add margins
        function addMargin () {
            var add = $(".advert");
            var addMargin = add.css("margin-left");
            add.css({
                "margin-top": addMargin,
                "margin-bottom": addMargin
            });
        }
        addMargin();
        $(window).resize(addMargin);
    
        //Responsive Grid
        var MusicGrid = (function() {
            var $musicGridContainer = $('.grid'),
                init = function() {
                    changeMusicGrid();
                    initEvents();
                    initPlugins();
                },
            changeMusicGrid = function() {
                var w_w = $(window).width();
                if (w_w <= 765) n = 1;
                else if (w_w <= 1180) n = 2;
                else n = 3;
            },
            initEvents = function() {
                $(window).on('smartresize.MusicGrid', function(event) {
                    changeMusicGrid();
                });
            },
            initPlugins = function() {
                $musicGridContainer.imagesLoaded(function() {
                    setTimeout(function() {
                        $musicGridContainer.masonry({
                            itemSelector: '.article',
                            columnWidth: function(containerWidth) {
                                return containerWidth / n;
                            },
                            isAnimated: true,
                            animationOptions: {
                                duration: 150
                            }
                        });
                    }, 500);
                });
            };
            return {
                init: init
            };
        })();
        MusicGrid.init();
    });
    
    
    //Preload Content
    function preloadCode() {
        if (preloadCode.done) return;
        preloadCode.done = true;
        clearTimeout(t);
    
        $(".preloader").css("display", "none");
        $(".grid").css({ opacity: 0, visibility: 'visible', marginTop: 20 }).animate({ marginTop: 0, opacity: 1 }, 550);
    
        $('.article[id^="article-"]').each(function () {
            if (parseInt(this.id.replace('article-', '')) % 3 === 0) {
                $('#' + this.id).css({ marginTop: 50 }).animate({ marginTop: 0 }, 350);
            } else if (parseInt(this.id.replace('article-', '')) % 2 === 0) {
                $('#' + this.id).css({ marginTop: 100 }).animate({ marginTop: 0 }, 400);
            } else {
                $('#' + this.id).css({ marginTop: 150 }).animate({ marginTop: 0 }, 450);
            }
        });
    
        $(".footer").css("display", "block");
    
    }
    
    var t = setTimeout(preloadCode, 6000);
    $(window).load(preloadCode);
    
    </script>
    
    
    //音频播放器
    audiojs.events.ready(函数(){
    var as=audiojs.createAll();
    $('audio')。每个(函数(){
    var myAudio=this;
    this.addEventListener('play',function(){
    $('audio')。每个(函数(){
    如果(!(此===myAudio)){
    这个。暂停();
    }
    });
    });
    });
    });
    $(文档).ready(函数(){
    //增加利润
    函数addMargin(){
    var add=$(“.advert”);
    var addMargin=add.css(“左边距”);
    add.css({
    “页边距顶部”:添加页边距,
    “页边距底部”:添加页边距
    });
    }
    addMargin();
    $(窗口)。调整大小(添加边距);
    //响应网格
    var MusicGrid=(函数(){
    变量$musicGridContainer=$('.grid'),
    init=函数(){
    changeMusicGrid();
    initEvents();
    initPlugins();
    },
    changeMusicGrid=函数(){
    var w_w=$(窗口).width();
    
    如果(w_w1.广告应该在顶部和底部有由jQuery计算的边距,那么opera和firefox中没有。那么我是否遗漏了什么?也许我需要应用某些代码标准?

    元素具有自动边距,因此,根据浏览器,
    .css('margin-left')
    可能返回不同的值,包括
    0

    我建议使用,这是一个轻量级插件,可以让您获得以像素为单位的实际边距

    2.播放器,只需比较它在chrome中的工作方式,然后在firefox或opera中查看,首先它不会显示“…”这表示加载,其次,一旦你在另一个播放器上单击“播放”,两首歌曲都会继续播放,就像在其他浏览器中一样,第一首歌曲会暂停,因此只有一首歌曲播放。

    Firefox和Opera在其音频元素中不支持mp3,因此它被flash对象取代。因此,您无法再收听这些DOM事件

    尽管根据它们的特性,flash对象具有公共方法
    play()
    pause()
    、和
    isplay

    我建议您收听“播放暂停”按钮上的点击事件,并使用以下功能。如下所示:

    var as = ''; // You're going to have to make your as variable global to access it outside of your function.
    audiojs.events.ready(function () {
        as = audiojs.createAll();
        $('.audiojs .play-pause').click(function(){ //Listening to the click event
            var thisIndex = $(this).parents('.audiojs').index('.audiojs'); // When you create several players, as is an array of instances of players. Here we're finding the DOM index of the player so it reflects its position in the as array.
            $.each(as, function(index,val){ //then, for each instance of players in the as array
                if ( index != thisIndex && as[index].playing ) as[index].pause(); //If the player is already playing, and its index is different than the one we just clicked on, pause it !
            });
        });
    });
    

    最好将相关代码放在这里。@JosephDreamer好的,我将包括我编写的代码,因为我认为这不应该与我在FF中包括的插件有关,
    var addMargin=add.css(“左边距”);
    正在返回
    0px
    。左边距首先设置在哪里?@css margin中的Barmar被设置为margin:0 auto;因此它接受左边距的值并应用于top和bot,以使它们响应。我想您看到了
    css(“左边距”)的不同方式
    设置为
    auto
    时有效。一些浏览器返回计算的边距,其他浏览器返回未设置的声明边距。