Jump to content

Подгрузка контента при помощи jquery


Shaman14-21
 Share

Recommended Posts

Имеется скрипт, подгружающий контент с дива "content" из нужной страницы, и меняющий адрес в адресной строке, но он не доделан.

Нужно:

1. Сделать подгрузку <title>

2. Добавить подгрузку с дива "menu"

3. Починить кнопки Назад-вперёд в браузере.

Собственно, сам скрипт.

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>     <script type="text/javascript">$(function() {$(".tab").click(function() {            var href = $(this).attr('href')            console.log(href)            $( "#content" ).load(href+' #content');        window.history.pushState(href, 'newtitle', href);            return false});});$(document).delegate('*[data-toggle="lightbox"]', 'click', function(event) { event.preventDefault();$(this).ekkoLightbox(); });</script>

Заранее спасибо.

Edited by Shaman14-21
Link to comment
Share on other sites

Есть открытие div при нажатии ссылки, а как сделать чтобы сразу отображалось содержимое div на странице?

Исходники:

____________________

Страница отображения :

<html>
<head>
<title>Подгрузка нужного контента других страниц</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Language" content="ru">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script>
 
<script>
$(document).ready(function()
{
 
;(function($) {
    $.lebnikLoad = function(selector, url, callback){ $(document.body).lebnikLoad(selector, url, callback, true); };
    $.fn.lebnikLoad = function(selector, url, callback, without_selector_document){
        var selector_document = this;
        var e = $('<iframe style="display:none" src="'+url+'"></iframe>');
        $(document.body).append( e );
        $(e).load(function(){
            var x = $(selector, e[0].contentWindow.document);
            if(callback){
                callback(x);
            }else if(without_selector_document != true){
                $(selector_document).html( $(x).html() );
            }
        });
    };
})(jQuery);
});
</script>
 
 
 
</head>
<body>
 
<a  href="#content_from2" onclick="$('#videobox').html('Загрузка...').lebnikLoad('#content_from1', 'http:/домен/page.html'); return false;">Открыть</a>
 
 
<div id="videobox"></div>
 
 
 
</body>
</html>
___________________
Страница  от куда загружается контент:
<html>
<head>
<title>Отображение в div</title>
<META HTTP-EQUIV=”Content-Type” content="text/html; charset=windows-1251">
<meta http-equiv="Content-Language" content="ru">
</head>
<body>
 
<div id="content_from1">
 
Цена: уточняйте
 
</div>
 
 
</body>
</html>
Link to comment
Share on other sites

 

Есть открытие div при нажатии ссылки, а как сделать чтобы сразу отображалось содержимое div на странице?

Исходники:

____________________

Страница отображения :

<html>
<head>
<title>Подгрузка нужного контента других страниц</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Language" content="ru">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script>
 
<script>
$(document).ready(function()
{
 
;(function($) {
    $.lebnikLoad = function(selector, url, callback){ $(document.body).lebnikLoad(selector, url, callback, true); };
    $.fn.lebnikLoad = function(selector, url, callback, without_selector_document){
        var selector_document = this;
        var e = $('<iframe style="display:none" src="'+url+'"></iframe>');
        $(document.body).append( e );
        $(e).load(function(){
            var x = $(selector, e[0].contentWindow.document);
            if(callback){
                callback(x);
            }else if(without_selector_document != true){
                $(selector_document).html( $(x).html() );
            }
        });
    };
})(jQuery);
});
</script>
 
 
 
</head>
<body>
 
<a  href="#content_from2" onclick="$('#videobox').html('Загрузка...').lebnikLoad('#content_from1', 'http:/домен/page.html'); return false;">Открыть</a>
 
 
<div id="videobox"></div>
 
 
 
</body>
</html>
___________________
Страница  от куда загружается контент:
<html>
<head>
<title>Отображение в div</title>
<META HTTP-EQUIV=”Content-Type” content="text/html; charset=windows-1251">
<meta http-equiv="Content-Language" content="ru">
</head>
<body>
 
<div id="content_from1">
 
Цена: уточняйте
 
</div>
 
 
</body>
</html>

 

Я и слова не понял о чём ты спрашиваешь. И мне не нужна замена скрипту, мне нужно допилить то что есть.

Link to comment
Share on other sites

пробуй не load а get

получаешь аяксом страницу и вытаскиваешь нужные данные $(data).find("title")

 

про кнопки взад и в перед ищи на htmlbook статью про использование history

Link to comment
Share on other sites

На счет вперед не скажу, а вот кнопка "назад" чинится добавлением такого обработчика:
 

$(window).on("popstate", function(e) {  if (e.originalEvent.state !== null) {    loadPage(location.href);  }});

Вот тут, туториал на тему.

Link to comment
Share on other sites

На счет вперед не скажу, а вот кнопка "назад" чинится добавлением такого обработчика:

 

$(window).on("popstate", function(e) {  if (e.originalEvent.state !== null) {    loadPage(location.href);  }});

Вот тут, туториал на тему.

Спасибо, только куда именно это нужно втыкнуть?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy