Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.07.2012, 16:11
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

Подгрузка контента на AJAX
Доброго времени суток.
Имеется страница:
<script>  
    function showContent(link) {  
  
        var cont = document.getElementById('contentBody');  
        var loading = document.getElementById('loading');  
  
        cont.innerHTML = loading.innerHTML;  
  
        var http = createRequestObject();  
        if( http )   
        {  
            http.open('get', link);  
            http.onreadystatechange = function ()   
            {  
                if(http.readyState == 4)   
                {  
                    cont.innerHTML = http.responseText;  
                }  
            }  
            http.send(null);      
        }  
        else   
        {  
            document.location = link;  
        }  
    }  
  
    // создание ajax объекта  
    function createRequestObject()   
    {  
        try { return new XMLHttpRequest() }  
        catch(e)   
        {  
            try { return new ActiveXObject('Msxml2.XMLHTTP') }  
            catch(e)   
            {  
                try { return new ActiveXObject('Microsoft.XMLHTTP') }  
                catch(e) { return null; }  
            }  
        }  
    }  
</script>

<form>  
        <input onclick="showContent('page2.html')" type="button" value="Страница 2">  
    </form>  
      
    <div id="contentBody">  
    </div>  
  
    <div id="loading" style="display: none">  
    Идет загрузка...  
    </div>

Из кода видно, что page2.html подгружается в div с id="contentBody
Как реализовать подобную подгрузку, но не всей страницы, а определенного div-a с id или class по нажатию на кнопку?
Ответить с цитированием
  #2 (permalink)  
Старый 24.07.2012, 16:38
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

malsyst,
попробуйте осуществить поиск непосредственно в объекте http
нужного тега
Ответить с цитированием
  #3 (permalink)  
Старый 24.07.2012, 16:46
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

В смысле через document.getElementById('data')? Но как прилепить к данному скрипту?
Ответить с цитированием
  #4 (permalink)  
Старый 24.07.2012, 16:57
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Вместо
cont.innerHTML = http.responseText;

- можа так ?
cont.innerHTML =http.getElementById('data').innerHTML
Ответить с цитированием
  #5 (permalink)  
Старый 24.07.2012, 17:05
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

Подскажите, пожалуйста, что нужно исправить в скрипте, чтобы выводилась не вся страница, а <div id="data">Содержимое блока</div>?
Ответить с цитированием
  #6 (permalink)  
Старый 24.07.2012, 17:30
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

<script>
	function showContent(link) {

		var cont = document.getElementById('contentBody');
		var loading = document.getElementById('loading');

		cont.innerHTML = loading.innerHTML;

		var http = createRequestObject();					// создаем ajax-объект
		if( http ) {
			http.open('get', link);							// инициируем загрузку страницы
			http.onreadystatechange = function () {			// назначаем асинхронный обработчик события
				if(http.readyState == 4) {
					cont.innerHTML =http.getElementById('data').innerHTML;		// присваиваем содержимое
				}
			}
			http.send(null);    
		} else {
			document.location = link;	// если ajax-объект не удается создать, просто перенаправляем на адрес
		}
	}

	// создание ajax объекта
	function createRequestObject() {
		try { return new XMLHttpRequest() }
		catch(e) {
			try { return new ActiveXObject('Msxml2.XMLHTTP') }
			catch(e) {
				try { return new ActiveXObject('Microsoft.XMLHTTP') }
				catch(e) { return null; }
			}
		}
	}
</script>

Не работает(
Ответить с цитированием
  #7 (permalink)  
Старый 24.07.2012, 17:44
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

<div id="Container" style="display:none;padding:12px;border:red solid 1px;"></div>
<script> //ПОДГРУЗКА КОНТЕНТА//
 var  Link='http://forum.mybb.ru/'; //Ваша Ccылка

function getXmlHttp(){var xmlhttp;try{xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")}catch(e){try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")}catch(E){xmlhttp=false}}if(!xmlhttp&&typeof XMLHttpRequest!='undefined'){xmlhttp=new XMLHttpRequest()}return xmlhttp}

var xmlhttp=getXmlHttp();xmlhttp.open('GET',Link,true);xmlhttp.onreadystatechange=function(){if(xmlhttp.readyState==4){
if(xmlhttp.status==200){
var Container=document.getElementById('Container');Container.innerHTML=xmlhttp.responseText;
alert(Container.document.getElementById('data').innerHTML)
}}};
xmlhttp.send(null);
</script>
Ответить с цитированием
  #8 (permalink)  
Старый 24.07.2012, 18:05
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

Deff, подскажите, пожалуйста, как это одаптировать под нужный вариант?
Подставить кнопку
<form>
<input onclick="showContent('page2.html')" type="button" value="Страница 2">
</form>
Не получается ничего...(
Ответить с цитированием
  #9 (permalink)  
Старый 24.07.2012, 18:06
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

malsyst,
Нужный див считываецо ?
Ответить с цитированием
  #10 (permalink)  
Старый 24.07.2012, 18:11
Аспирант
Отправить личное сообщение для malsyst Посмотреть профиль Найти все сообщения от malsyst
 
Регистрация: 20.07.2012
Сообщений: 80

К сожалению нет... пустое окошко? (
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Логика динамической подгрузки контента через Ajax TheKeeeper AJAX и COMET 6 21.03.2012 23:16
Подгрузка контента страницы kozhilya AJAX и COMET 6 24.02.2012 20:34
Подгрузка контента Контакта beerdy AJAX и COMET 5 25.10.2011 10:24
jQuery Validator и ajax подгрузка полей RRRinat jQuery 3 30.08.2011 01:57
Подгрузка контента в определённый DIV при нажатии на ссылку, без перезагрузки страниц Flashton Events/DOM/Window 0 10.03.2010 19:53