Обновить содержимое iframe (локальный HTML) при нажатии кнопок

Question

Я загружаю файл HTML в DIV (iframe), когда пользователь нажимает кнопку.

Моя проблема в том, когда вы нажимаете другую кнопку, и вам нужно перезагрузить iframe другим HTML-файлом.

Это мой код:

<script type="text/javascript"> 
$(function(){ 
    $('#2015').click(function(){ 
     if(!$('#iframe').length) { 
       $('#content').html('<iframe id="iframe" src="2015.html" width="700" height="450"></iframe>'); 
     } 
    }); 
}); 
</script> 

А вот код кнопки:

<a href ="#" id="2015">2015</a> 

Как я могу удалить содержимое Iframe, прежде чем загрузить следующий HTML в него?

Answer 1

Вы сделали ошибку здесь. Идентификатор не должен начинаться с номера. Поэтому используйте btn2015 вместо 2015 как ID на кнопке.

Ссылка должна сделать все остальное:

Reload an iframe with jQuery

Answer 2

Благодаря Джонатан.

Изменение ID и незначительные изменения работают нормально.

I'm тестирования другой способ и работает тоже:

1. Присвоить "имя" для фрейма с HTML по умолчанию:

   <iframe name="year" src="2015.html"></iframe> 
   

2. Прямая <a> связь с URL и iframe «имя» в качестве цели:

   <a href="2014.html" target="year">Change Link</a>