VPF::jQuery, загрузка документов в другой DIV

kamnerobot

Дата 29.3.2018, 22:54 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 15
Регистрация: 30.5.2010

Репутация: нет
Всего: нет

вот такой документ

Код


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>

<div class="wrapper">
<div class="menu">Ждем ответа</div>
<div class="main">123</div>
</div>

<script src="js/jquery-3.3.1.min.js"></script>
<script>
    $(document).ready(function(){
        $('a .cat').click(function(){
            $('.main').load($('.cat').attr('href'));
        });
    });
</script>
<script>
    $.ajax({
        method:"GET",
        url: 'dbreader.php?catlist=1',
        success: function(data) {
            $('.menu').html(data);
        }
    });
</script>
</body>
</html>

сначала в div с классом menu загружаются собственно меню(в коде строки 23-31):

Код


<div class="cat"><a class="cat" href="dbreader.php?cat=1">category 1</a></div>
<div class="cat"><a class="cat" href="dbreader.php?cat=2">category 2</a></div>
<div class="cat"><a class="cat" href="dbreader.php?cat=3">category 3</a></div>
<div class="cat"><a class="cat" href="dbreader.php?cat=4">category 4</a></div>
<div class="cat"><a class="cat" href="dbreader.php?cat=5">category 5</a></div>
...

по клику на эти ссылки перезагружается вся страница, а мне нужно, что бы результат вывода скрипта dbreader.php загружался в div .main. Как это можно реализовать?

Это сообщение отредактировал(а) kamnerobot - 29.3.2018, 22:56

kamnerobot

Дата 30.3.2018, 17:23 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 15
Регистрация: 30.5.2010

Репутация: нет
Всего: нет

Решено. На другом форуме подсказали. Вот так это делается:

Код


$(document).ready(function() {
  $('.menu').on('click', 'a.cat', function(e) {
    e.preventDefault();
 
    $('.main').load($(this).attr('href'));
  });
});

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »