при условии, что вы действительно хотите сделать что-то вроде этого: http://powerwall.msnbc.msn.com/
Я предполагаю, что они используют комбинацию ajax-запросов и что-то вроде этого: http://tkyk.github.com/jquery-history-plugin/
убедитесь, чтоНавигация (все ссылки и т. д.) в окне работает через ajax - проверьте все ссылки и предоставьте им новую функциональность с помощью js.Вы можете написать некоторую функцию, которая запрашивает href url через ajax, а затем заменить содержимое вашего ящика....
function change_box_links(output_area){
output_area.find('a').each(function(){
$(this).bind('click', function(e){
e.preventDefault();
var url = $(this).attr('href');
$.ajax({
url: url,
success: function(data){
output_area.html(data);
//update url in addressbar
change_box_links(output_area);
}
});
});
});
}
это обновляемое решение, но оболочка показывает основную идею ...
приложение [2011-05-15]
Избавьтесь от мысли, что у вас будет два файла, которые могут обрабатывать несколько «ящиков».я имею в виду, что вы можете сделать это, но оно того стоит.
но чтобы иметь возможность настроить ваши шаблоны как обычные html-страницы, вы можете использовать вышеописанный скрипт для анализа hjml-страниц, запрошенных ajax.создать свои html-страницы для
- просмотра контента,
- просмотра результатов поиска
- и т. д.
на главнойНа странице вы должны предоставить какую-то «коробку», где вы можете отобразить то, что вам нужно.я рекомендую div:
<div id="yourbox"></div>
на вашей главной странице есть кнопки для отображения этого поля с различным содержимым, как на странице примера, которую вы нам показали.если вы нажмете одну из них, JS создаст вызов ajax на нужную страницу:
(здесь с jquery)
$('#showsearch_button').bind('click', function(){showsearch();});
function show_search() {
$.ajax({
url: 'search.php',
success: function(data){
var output_area = $('#yourbox');
output_area.html(data);
$.address.hash('search');
change_box_links(output_area);
}
});
});
для других кнопок, которые у вас будутаналогичные функции.Первая функция (см. выше) предусматривает, что запрошенное содержимое блока может быть записано как обычная HTML-страница (так что вы также можете вызывать ее как отдельную).Вот его обновление, где он также предоставляет изменения URL-адреса хештега:
jquery и требует плагин истории
function change_box_links(output_area){
output_area.find('a').each(function(){
$(this).bind('click', function(e){
e.preventDefault();
var url = $(this).attr('href');
$.ajax({
url: url,
success: function(data){
output_area.html(data);
var name = url.replace('/\.php/','');
$.address.hash(name);
change_box_links(output_area);
}
});
});
});
}
ивам понадобится какая-то эта функция, которая будет связывать кнопки «назад» и «вперед» вашего браузера:
$.address.change(function(event) {
var name = $.address.hash();
switch(name){
case 'search': show_search(); break;
default: alert("page not found: "+name);
}
});
приведенный выше код должен дать представление о том, как вы можете решить вашу проблему.вам нужно быть очень последовательным с именами файлов, если вы просто скопируете и пропустите это.еще раз: это поправимо, но оболочка покажет вам хитрость; -)