jQuery .remove() - youtube iframe не удаляется полностью в Internet Explorer

Я удаляю элемент tr из этой таблицы с помощью jQuery 1.7.1, и он не работает в Internet Explorer (у меня 8.07, но я догадываюсь начислено сделать это - другие люди имеют то же самое)jQuery .remove() - youtube iframe не удаляется полностью в Internet Explorer

Удалить вызов:

$("#tr_video_element_1").remove();

Когда я это делаю, экран становится черным (кажется, это YouTube IFrame фон или что-то - несколько дней назад была часть сайта, которая была ссылкой на одно из видео YouTube в).

Код проверяет штраф. Что я делаю не так?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 


<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <link type="text/css" href="css/smoothness/jquery-ui-1.8.16.custom.css" rel="stylesheet" /> 
    <link rel="stylesheet" type="text/css" href="css/style.css" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
    <script src="js/jquery-ui-1.8.16.custom.min.js" type="text/javascript"></script> 
    <script src="js/sorted_elements.js" type="text/javascript"></script> 
    <script src="js/ajax.js" type="text/javascript"></script> 
    <title> Panel </title> 
</head> 
<body><table id="editorial_table"><thead><tr> 
        <th>Position</th> 
        <th>Youtube video id</th> 
        <th>Video</th> 
        <th>Delete</th> 
       </tr> 
     </thead><tbody><tr class="video_tr_element" id="tr_video_element_1"><td><input readonly="readonly" class="position" name="input_position_1" id="input_position_1" size="1" type="text" value="1" /></td><td><input class="yt_link" name="yt_link_position_1" id="yt_link_position_1" type="text" value="cjDyJnzYgpk" /> 
        <div style="margin:auto; margin-top:9px; width:70px; "> 
         <a href="#" class="up 1" id="up_pos_1"><img src="img/up_arrow.png" alt="Move object up" /></a> 
         <a href="#" class="down 1" id="down_pos_1"><img src="img/down_arrow.png" alt="Move object down" /></a> 
        </div> 
       </td><td><div class="inline" style="height:186px;width:210px;margin:0;margin-right:5px;padding:0; "> 

         <iframe id="if_pos_1" title="YouTube video player" class="youtube-player" 
         width="210" height="186" src="http://www.youtube.com/embed/cjDyJnzYgpk" 
         frameborder="0"></iframe> 
      </div></td><td><a class="delete 1" href="#">Delete</a></td></tr><tr class="video_tr_element" id="tr_video_element_2"><td><input readonly="readonly" class="position" name="input_position_2" id="input_position_2" size="1" type="text" value="2" /></td><td><input class="yt_link" name="yt_link_position_2" id="yt_link_position_2" type="text" value="cjDyJnzYgpk" /> 
        <div style="margin:auto; margin-top:9px; width:70px; "> 
         <a href="#" class="up 2" id="up_pos_2"><img src="img/up_arrow.png" alt="Move object up" /></a> 
         <a href="#" class="down 2" id="down_pos_2"><img src="img/down_arrow.png" alt="Move object down" /></a> 
        </div> 
       </td><td><div class="inline" style="height:186px;width:210px;margin:0;margin-right:5px;padding:0; "> 

         <iframe id="if_pos_2" title="YouTube video player" class="youtube-player" 
         width="210" height="186" src="http://www.youtube.com/embed/cjDyJnzYgpk" 
         frameborder="0"></iframe> 
      </div></td><td><a class="delete 2" href="#">Delete</a></td></tr><tr class="video_tr_element" id="tr_video_element_3"><td><input readonly="readonly" class="position" name="input_position_3" id="input_position_3" size="1" type="text" value="3" /></td><td><input class="yt_link" name="yt_link_position_3" id="yt_link_position_3" type="text" value="NMqLH6_bDNs" /> 
        <div style="margin:auto; margin-top:9px; width:70px; "> 
         <a href="#" class="up 3" id="up_pos_3"><img src="img/up_arrow.png" alt="Move object up" /></a> 
         <a href="#" class="down 3" id="down_pos_3"><img src="img/down_arrow.png" alt="Move object down" /></a> 
        </div> 
       </td><td><div class="inline" style="height:186px;width:210px;margin:0;margin-right:5px;padding:0; "> 

         <iframe id="if_pos_3" title="YouTube video player" class="youtube-player" 
         width="210" height="186" src="http://www.youtube.com/embed/NMqLH6_bDNs" 
         frameborder="0"></iframe> 
      </div></td><td><a class="delete 427" href="#">Delete</a></td></tr><tr class="video_tr_element" id="tr_video_element_4"><td><input readonly="readonly" class="position" name="input_position_0" id="input_position_0" size="1" type="text" value="0" /></td><td><input class="yt_link" name="yt_link_position_0" id="yt_link_position_0" type="text" value="" /> 
        <div style="margin:auto; margin-top:9px; width:70px; "> 
         <a href="#" class="up 0" id="up_pos_0"><img src="img/up_arrow.png" alt="Move object up" /></a> 
         <a href="#" class="down 0" id="down_pos_0"><img src="img/down_arrow.png" alt="Move object down" /></a> 
        </div> 
       </td><td><div class="inline" style="height:186px;width:210px;margin:0;margin-right:5px;padding:0; "> 

         <iframe id="if_pos_0" title="YouTube video player" class="youtube-player" 
         width="210" height="186" src="http://www.youtube.com/embed/" 
         frameborder="0"></iframe> 
      </div></td><td><a class="delete 478" href="#">Delete</a></td></tr><tr class="video_tr_element" id="tr_video_element_5"><td><input readonly="readonly" class="position" name="input_position_4" id="input_position_4" size="1" type="text" value="4" /></td><td><input class="yt_link" name="yt_link_position_4" id="yt_link_position_4" type="text" value="NMqLH6_bDNs" /> 
        <div style="margin:auto; margin-top:9px; width:70px; "> 
         <a href="#" class="up 4" id="up_pos_4"><img src="img/up_arrow.png" alt="Move object up" /></a> 
         <a href="#" class="down 4" id="down_pos_4"><img src="img/down_arrow.png" alt="Move object down" /></a> 
        </div> 
       </td><td><div class="inline" style="height:186px;width:210px;margin:0;margin-right:5px;padding:0; "> 

         <iframe id="if_pos_4" title="YouTube video player" class="youtube-player" 
         width="210" height="186" src="http://www.youtube.com/embed/NMqLH6_bDNs" 
         frameborder="0"></iframe> 
      </div></td><td><a class="delete 494" href="#">Delete</a></td></tr></tbody></table> 
</body></html>

источник

2012-01-02 pablosd

Internet Explorer (любая версия) хорошо известен для обработки таблиц и всех операций, а затем очень странно. Почему вам нужно удалить таблицу строк (tr)? Разве вы не можете просто разместить свой iframe в любом div, а затем поместить его в tr (фактически в td, содержащемся внутри tr)? Затем вы удаляете div и оставляете tr пустым. Вы должны получить тот же эффект, но без каких-либо проблем, который может быть вызван удалением строки таблицы вместо ее содержимого.

источник

2012-07-16 13:46:07 trejder

Недавно я столкнулся с этой проблемой в Internet Explorer 8. Моя работа заключалась в том, чтобы сначала очистить атрибут src iframe, а затем удалить его.

$('#iframeID').attr("src", " "); 
$('#iframeID').remove();

источник

2013-01-11 20:32:20 Kathryn

Это тоже помогло мне, хотя я использовал '$ (this) .attr ('src', '');' но это фактически то же самое. Как приложение, это все еще проблема в IE9 - удивление, удивление! :) – army

Хотя это устраняет симптомы, я бы предположил, что есть основная утечка памяти, которую мы все еще не разрешили. – adamdport

jQuery .remove() - youtube iframe не удаляется полностью в Internet Explorer

ответ

Смежные вопросы