Javascript 使用jQuery多次添加和删除元素

我使用jQuery在点击按钮时附加youtube视频

onclick="$('#videogallery').append('<iframe width=725 height=398 src=http://www.youtube.com/embed/8Pi-dHJSkrk frameborder=0 allowfullscreen></iframe>');"

onclick="$('iframe').remove();"

第一次使用时效果很好，但如果我添加视频，请将其删除，然后再次尝试添加。它会立即添加和删除自身

为什么会这样？它看起来像是$（'iframe'）.remove（）；单击按钮后，功能将持续运行

编辑

下面是代码的扩展版本

   <div class="product-media" id="product-media1">
    <map name="submenu3" onclick="$('iframe').remove();">
      <area shape="rect" coords="0, 0, 95, 25"  onClick="swap3('product-media1','product-details1');">
      <area shape="rect" coords="103, 0, 213, 25"  onClick="swap3('product-media1','product-specs1');">
    </map>
    <img src="images/submenu3.jpg" alt="" border="0" usemap="submenu3" /><br /><br />
    <p>&nbsp;</p>
    <div id="videogallery">
                <a rel="#voverlay" href="#" onclick="$('#videogallery').append('<iframe width=725 height=398 src=http://www.youtube.com/embed/8Pi-dHJSkrk frameborder=0 allowfullscreen></iframe>');">
        <span class="thumb" onClick="swapvid"><img src="images/video.jpg" alt="" align="left" /></span><span></span>
      </a><br />
      &nbsp;&nbsp;Watch Scotch-Brite&trade; Radial Discs in action
    </div>
  </div>

观看苏格兰威士忌英国和贸易；活动中的径向圆盘

这很好用：

$（'#添加'）。单击（函数（）{
$（'#vid'）。附加（'''）；
});
$（'#del'）。单击（函数（）{
$（'iframe'）.remove（）；
});

编辑：使用地图摆弄

单击
这很好：

$（'#添加'）。单击（函数（）{
$（'#vid'）。附加（'''）；
});
$（'#del'）。单击（函数（）{
$（'iframe'）.remove（）；
});

编辑：使用地图摆弄
点击
你能发布整个代码吗？听起来你在堆积额外的“onclick”事件。这是一个糟糕的编码，但是您可以通过在onclick函数中执行返回false来修复它。您可以发布整个代码吗？听起来你在堆积额外的“onclick”事件。这是一个糟糕的编码，但是您可以通过在onclick函数中执行一个返回false来修复它。我看到它可以在jsfiddle上工作，所以不确定为什么它不能在myn上工作。我添加了更大的代码块。是否在地图上使用onClick会导致问题？我更新了答案。我还真的认为你应该把你的
javascript
从
html
中分离出来，它让一切变得更好。我看到它在JSFIDLE上工作，所以不确定为什么它不在myn上工作。我添加了更大的代码块。是否在地图上使用onClick会导致问题？我更新了答案。我还真的认为你应该把你的
javascript
从
html
中分离出来，这会让一切变得更好。
$('#add').click(function(){
    $('#vid').append('<iframe width=725 height=398 src=http://www.youtube.com/embed/8Pi-dHJSkrk frameborder=0 allowfullscreen></iframe>');

});


$('#del').click(function(){
    $('iframe').remove();
});