jQuery单击链接,但必须单击两次才能工作?

时间:2013-11-21 22:25:14

标签: jquery

我有这段代码可以获取id并传递给插件调用,但是你必须点击它两次来处理任何想法?

// Let's setup the video overlay's (if any)
    jQuery('a.play').on("click", function() {
        var videoUrl = jQuery(this).attr('id');
        jQuery("a.play").dojoVideo({
                'videoid' : videoUrl,
                'videoplayer' : 'youtube', // options - youtube or vimeo
                'width' : '800px', // video width
                'height' : '450px', // video height
                'autoplay' : 'true'// options - true or false
            });
            return false
    });

我注意到在插件中它有一个点击功能,但不知道如何更改这个,所以我使用我的,而不是需要获取id并传递它,就像我正在做的那样。

jQuery.fn.dojoVideo = function (options) {

    var settings = { // Defaults
        'videoid' : '',
        'videoplayer' : 'youtube',
        'width' : '530px',
        'height' : '330px',
        'autoplay' : 'false'
    };

    return this.each(function() {        
       // If options exist, lets merge them
      // with our default settings
      if ( options ) { 
        $.extend(settings, options);
      }

    function centerS(cur) {

        var cur = cur;

        cur.css("position","absolute");
        cur.css("top", ( $(window).height() - cur.height() ) / 2+$(window).scrollTop() + "px");
        cur.css("left", ( $(window).width() - cur.width() ) / 2+$(window).scrollLeft() + "px");
        return this;
    }

    $(this).click(function(){
        var a=$(document).height();
     var b=$(window).width();
        var popuphtml = '<div id="dvGlobalMask"></div><div id="dojoVideo"><div class="modalnav"></div><div id="videocontent"></div></div>';
        $('body').append(popuphtml);
        $("#dvGlobalMask").css({width:b,height:a});
        $("#dvGlobalMask").fadeTo("fast",0.4);

        $('#dojoVideo').css('width' , settings.width);
        $('#dojoVideo').css('height' , settings.height);
        centerS($("#dojoVideo"));

        var autoplay = 0;
        if (settings.autoplay == 'true') {
            autoplay = 1;
        } else {
            autoplay = 0;
        }
        // Checks for the type of video that is being pulled.
        youtubestr = '<iframe width="' + settings.width + '" height="' + settings.height + '" src="http://www.youtube.com/embed/' + settings.videoid + '?autoplay=' + autoplay + '&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>';
        vimeostr = '<iframe src="http://player.vimeo.com/video/' + settings.videoid + '?color=00adef&amp;show_title=0&amp;show_portrait=0&amp;autoplay=' + autoplay + '" width="' + settings.width + '" height="' + settings.height + '" frameborder="0"></iframe>';

        switch (settings.videoplayer) {
            case 'youtube' :
                $("#videocontent").html($(youtubestr));
            break;
            case 'vimeo' :
                $("#videocontent").html($(vimeostr));
            break;
        }

        $("#dojoVideo").show();
        $('.modalnav').show();
        //$(settings.videoid).show();
        }); 

        $('.modalnav').live('click', function(){
            $('#dvGlobalMask').hide();
            $('#dojoVideo').hide();
            $('.modalnav').hide();
            $('#videocontent').html('');
            $(settings.videoid).hide();
        });
    });

    return this;
}

2 个答案:

答案 0 :(得分:0)

我最后只是为每个链接使用3个插件函数和一个单独的类,因为必须在很短的时间内完成这个 - 但是我会修改插件,以便以后更灵活,并会更新这篇文章有更好的答案。

答案 1 :(得分:-2)

试试这个:

jQuery('a.play').click( function() {

(基本上你想删除.on并用.click替换它,然后在函数前删除“click”。