Обновить часть страницы

Пожалуйста, помогите!Обновить часть страницы

Можете ли вы объяснить мне, как перезагрузить часть страницы С URL изменения, но он должен не включая хэш-тег.

некоторый код:
URL: mysite.com/ первый/

<html> 
<body> 
    <h1>RELOAD!</h1> 
    <div>few words...</div> 
    <input type="button"> 
<body> 
</html>

хотят изменить, чтобы:
URL: mysite.com/ второй/

<html> 
<body> 
    <h1>RELOAD!</h1> 
    <div>other few words...</div> 
    <input type="button"> 
<body> 
</html>

Как Я могу перезагрузить контент только в DIV на другом?

я вижу еще один пример, как это следующее:

if (location.href.indexOf("#") > -1) 
    location.assign(location.href.replace('#', "/"));

НО - это перезагружать всю страницу!

.htaccess - Я не могу использовать, потому что обугленный „#“ и следующий текст не отправляются на сервер.

Также я видел код:

history.pushState(null, null, '#myhash'); 
if(history.pushState) { 
    history.pushState(null, null, '#myhash'); 
} 
else { 
    location.hash = '#myhash'; 
}

, но не могу понять это правильно.

Возможно, есть и другой правильный способ, как это сделать.

источник

2014-02-09 serge

Nope. Другого пути нет. 'pushState' - это способ сделать это. Лучше начните понимать это. :) – GolezTrol

Документация не под термином pushState фактически является частью объекта истории. https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history?redirectlocale=en-US&redirectslug=Web%2FGuide%2FDOM%2FManipulating_the_browser_history – Dylan

Есть на самом деле две разные проблемы здесь:

Как загружать содержимое с сервера и отобразить его в существующую страницу, без перезагрузки всей страницы
Как заставить это выглядеть, как вы на новый URL, без перезагрузки страницы

Ни один из них имеют ничего общего с .htaccess (под которым обычно подразумевается mod_rewrite модуль Apache), потому что они оба о том, как го e Клиент ведет себя, а не сервер .

Первая часть обычно называется «AJAX», о которой вы найдете множество информации в Интернете. «X» изначально означало «XML», но на самом деле вы можете получать любые требуемые данные, такие как простой текст или кусок готового HTML, и использовать JavaScript для его размещения на своей странице. Популярная библиотека jQuery имеет a method called .load(), которая делает запрос на сервер и использует ответ для замены определенной части страницы.

Вторая часть немного сложнее - поскольку на самом деле страница не была перезагружена, вы, по сути, хотите, чтобы браузер лгал о текущем URL-адресе. Причина, по которой вы увидите множество примеров, изменяющих только части URL после # именно потому, что они не отправляются на сервер; традиционно они используются для прокрутки текущей страницы до «якоря» в виде патикулы. Поэтому вы можете изменять их так часто, как вам нравится, и если пользователь закладок или разделяет вашу страницу, вы можете посмотреть на часть после # и повторно загрузить состояние, которое они размещают в закладках.

Однако, как часть группы технологий «HTML5», была добавлена возможность изменить фактическую строку URL-адреса браузера, «нажав состояние» на объект history. Другими словами, добавление записи в меню назад/вперед браузера без фактической загрузки новой страницы. Существуют очевидные ограничения безопасности (вы не можете притворяться, что пользователь перешел в совершенно другой домен), но сам API довольно прост. Here is the MDN documentation explaining it.

Для вашего простого примера, предполагая, что JQuery был включен, вы можете сделать что-то вроде этого:

// Find the div with a jQuery selector; this would be more specific in reality 
jQuery('div') 
    // Request some text from the server to replace the div 
    .load(
     // This URL can be anything that generates the appropriate HTML 
     '/ajax.php?mode=div-content&stage=second', 

     // Add a callback function for when the AJAX call has finished 
     function(responseText, textStatus, XMLHttpRequest) { 
      // Inside the callback function, set the browser's URL bar 
      // and history to pretend this is a new page 
      history.pushState({}, '', '/second/'); 
    } 
);

Обратите внимание, что Jquery далеко не единственный способ сделать это, он просто держит пример простой в используйте существующую функцию, которая делает для нас большую часть работы.

источник

2014-02-09 19:44:07 IMSoP

Хорошо, спасибо ... Но что о времени ... Если мои данные будут обновляться, а в кассе сохранена старая версия - я всегда получаю старые данные? Или что? – serge

@serge Я не уверен, что вы имеете в виду. Если пользователь нажимает «обновить», их браузер должен загрузить URL-адрес в адресной строке, которая будет вашей «второй» страницей, и может соответствующим образом отобразить содержимое. Запрос AJAX также можно кэшировать, основываясь на заголовках кеширования HTTP, которые вы установили (как и на любой другой странице или ресурсе). – IMSoP

, если я сделаю следующее действие: 'history.pushState ({page: – serge

Обновить часть страницы

ответ

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