Question

我正在尝试使用jquery创建HTML标记：

<div class="icon"></div>

如果页面上存在youtube视频，则创建以上标记：

if ($('div.container iframe').length) {
  alert('frame exists');
  $('<div class="icon"></div>');
}

然而，它不会创建标记。我希望用户粘贴youtube视频然后我的Jquery应该自动为它们创建图标。请看我的实施：

var $video = $('div.container iframe');  //location of video
var $productImage = $('.product-image'); //location of main prod img
var $icon = $('.icon');                  //location of icon

//check if video exists
if ($('div.container iframe').length) {
    alert('frame exists');
  $('<div class="icon"></div>');

}

$('.product-image').append($video);      //append the video to the main prod img

$icon.on('click', function() {           //click
    $video.toggle();                     //toggle the video based on click
});

JSFIDDLE： http://jsfiddle.net/t7qMF/7/ 解决方案： http://jsfiddle.net/t7qMF/13/

Answer 1

首先检查iframe是否存在，如果存在，则append icon div -

if ($('div.container iframe').length > 0) {
    alert('frame exists');
    $('.container').append('<div class="icon">Icon</div>');
}

更新了小提琴 - http://jsfiddle.net/t7qMF/11/

Answer 2

$('<div class="icon"></div>');创建标记，但不会将其放在任何位置。将其附加到某些内容上它应该可以正常工作。

检查是否存在iframe，然后使用jquery创建HTML标记

2 个答案: