jquery删除vimeo iframe

我有一个小脚本，它将一个vimeo视频加载到div onclick中，然后是一个“应该”将它移除的按钮。不用说我也不会在这里发贴，如果它是工作，如果我没有发现已经在别处堆栈工作液所以...在这里我的代码：jquery删除vimeo iframe

$('.play_button').click(function() { 
    $(".play_border, .styled-header").remove(); 
    $(".video-container").append('<iframe id="vimeo" src="//player.vimeo.com/video/103277178?autoplay=1" width="100%" height="306" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe><div class="form-transparent"><button class="btn pull-right close_video" type="button">Close Video</button>'); 
}); 
$('.close_video').click(function() { 
    $("#vimeo").remove(); 
    $(".video-container").append('<div class="play_border"><div class="play_button"></div></div><h2 class="white styled-header">Play Our Video</h2>'); 
});

和HTML：

<div class="video-container"> 
    <div class="play_border"> 
     <div class="play_button"></div> 
    </div> 
    <h2 class="white styled-header">Play Our Video</h2> 
</div>

来源

2014-10-02 TEN Design

我做了一个基本的演示给你 - 您需要将按钮放在波纹管中，需要一些工作，但是工作正常 - http://jsfiddle.net/cyehoyp1/ – Tasos 2014-10-02 22:13:57

正如beaglebets监听器不点火，因为你试图将它添加到close_video存在之前提到的。你可以做到这一点，而不是这样：

function show_video() { 
    $(".play_border, .styled-header").remove(); 
    $(".video-container").append('<iframe id="vimeo" src="//player.vimeo.com/video/103277178?autoplay=1" width="100%" height="306" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe><div class="form-transparent"><button class="btn pull-right close_video" type="button">Close Video</button>'); 
    $(".close_video").click(hide_video); 
} 

function hide_video() { 
    $("#vimeo, .close_video").remove(); 
    $(".video-container").append('<h2 class="white styled-header">Play Our Video</h2><div class="play_border"><button class="btn play_button" type="button">Play</button></div>'); 
    $(".play_button").click(show_video); 
} 

$(".play_button").click(show_video);

http://jsfiddle.net/L5jcLLxz/

（我稍微改变你的HTML代码，这样实际上有东西点击play_button。）

来源

2014-10-02 22:19:50

@TENDesign不客气。如果您为close_video和play_button使用事件委派，您也可以按照beaglebets建议的方式执行此操作：http://jsfiddle.net/q18455wL/ – 2014-10-02 23:15:59

您的监听器未触发，因为您在close_video附加到页面之前正在监听它。由于您将其添加到页面中，您将需要使用事件委派。

$('.video-container').on('click', '.close_video', function() { 
    $("#vimeo").remove(); 
    $(".video-container").append('<div class="play_border"><div class="play_button"></div> </div><h2 class="white styled-header">Play Our Video</h2>'); 
});

来源

2014-10-02 21:49:27 beaglebets

这很有道理，但它仍然不能正常工作。我有点认为这是发生了什么事。 – 2014-10-02 22:00:34

如果你复制并粘贴它可能是由于close_video有一个下划线而不是短划线。我输错了。 – beaglebets 2014-10-02 22:05:26

jquery删除vimeo iframe

回答

相关问题