ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery, AJAX.
13 сообщений из 13, страница 1 из 1
jQuery, AJAX.
    #39000977
Малыш456
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Малыш456
Гость
Добрый день.
Не очень силен в премудростях сайтостроения, но пришлось столкнуться. Помогите пожалуйста разобраться.
Загружаю страницу index.php.
Код: html
1.
2.
3.
4.
5.
<body>
    <div id="kn1">ТАРИФЫ</div>
    <div id="kn2">УСЛУГИ</div>
    <div id="container1"><?php include("tarif.php");?></div>
</body>


Файл tarif.php имеет такой код:
Код: html
1.
2.
3.
    <div id="kn3">КАЛЬКУЛЯТОР СОКРАЩЕННЫЙ</div>
    <div id="kn4">КАЛЬКУЛЯТОР ПОЛНЫЙ</div>
    <div id="container2"><?php include("calculator1.php");?></div>


Функционал такой:
Нажимая на копки "kn1" или "kn2" AJAXом, силами jQuery подтягиваем в "container1" файлы "tarif.php" или "services.php". По умолчанию в "container1" загружается "tarif.php".
Загрузив "tarif.php" мы опять же можем прт нажатии "kn3" и "kn4" посредством jQuery и AJAX в "container2" подгружать файлы "calculator1.php" и "calculator2.php". По умолчанию это "calculator1.php".
Файл скриптов:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
$(function() {
    $('#kn1').click( function() {$.ajax({url:'tarif.php', success:function(data) {$('#container1').html(data);}});});
    $('#kn2').click( function() {$.ajax({url:'services.php', success:function(data) {$('#container1').html(data);}});});

    $('#kn3').click( function() {$.ajax({url:'calculator1.php', success:function(data) {$('#container2').html(data);}});});
    $('#kn4').click( function() {$.ajax({url:'calculator2.php', success:function(data) {$('#container2').html(data);}});});
});


Что реально происходит:
До использования скрипта, т.е. после загрузки страницы функции $('#kn3').click и $('#kn4').click отрабатывают замечательно. Но стоит попользоваться $('#kn1').click и $('#kn2').click - перестают работать $('#kn3').click и $('#kn4').click. Такая картина наблюдается во всех браузерах. Что это может быть и как с этим бороться?
Спасибо за ответ.
...
Рейтинг: 0 / 0
07.07.2015, 00:22
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001020
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Малыш456До использования скрипта, т.е. после загрузки страницы функции $('#kn3').click и $('#kn4').click отрабатывают замечательно. Но стоит попользоваться $('#kn1').click и $('#kn2').click - перестают работать $('#kn3').click и $('#kn4').click. Такая картина наблюдается во всех браузерах. Что это может быть и как с этим бороться?

Ситуация стандартная - на новых элементах просто нет обработчиков.
И выходы из нее стандартные:
- использовать делегирование
- каждый раз после загрузки вешать обработчики
...
Рейтинг: 0 / 0
07.07.2015, 08:18
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001030
kunaksergey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
kunaksergey
Гость
krvsa,

решение в лоб:

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
<script type="text/javascript">
	$(function() {
    myEvent=function(){
    	$('#kn3').on('click',function() {$.ajax({url:'calculator1.php', success:function(data) {$('#container2').html(data);}});});
    	$('#kn4').on('click',function() {$.ajax({url:'calculator2.php', success:function(data) {$('#container2').html(data);}});});
    }

    $('#kn1').on('click',function() {$.ajax({url:'tarif.php', success:function(data) {$('#container1').html(data);myEvent()}});});
    $('#kn2').on('click',function() {$.ajax({url:'services.php', success:function(data) {$('#container1').html(data);myEvent()}});});
    myEvent();
    
});
	</script>
...
Рейтинг: 0 / 0
07.07.2015, 08:44
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001035
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
kunaksergey , не совсем понимаю твое обращение ко мне... Т.к. твой "лоб" у меня идет первым в списке.
...
Рейтинг: 0 / 0
07.07.2015, 08:50
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001036
kunaksergey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
kunaksergey
Гость
krvsa,
:) ткнул как говорится не туда ..:)
...
Рейтинг: 0 / 0
07.07.2015, 08:53
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001055
SharuPoNemnogu
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SharuPoNemnogu
Участник
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
    clickToAjax('#kn1', 'tarif.php', '#container1');
    clickToAjax('#kn2', 'services.php', '#container1');
    clickToAjax('#kn3', 'calculator1.php', '#container2');
    clickToAjax('#kn1', 'calculator2.php', '#container2');

    function clickToAjax(element, url, conteiner)
    {
        $('body').on('click', element, function(){
            $.ajax({
                url: url,
                success: function(data) {
                    $(conteiner).html(data);
                }
            });
        });
    }
...
Рейтинг: 0 / 0
07.07.2015, 09:19
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001160
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
SharuPoNemnogu
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
    clickToAjax('#kn1', 'tarif.php', '#container1');
    clickToAjax('#kn2', 'services.php', '#container1');
    clickToAjax('#kn3', 'calculator1.php', '#container2');
    clickToAjax('#kn1', 'calculator2.php', '#container2');

    function clickToAjax(element, url, conteiner)
    {
        $('body').on('click', element, function(){
            $.ajax({
                url: url,
                success: function(data) {
                    $(conteiner).html(data);
                }
            });
        });
    }


ИМХО напрашивается использование data-атрибутов, а не предложенное решение.
...
Рейтинг: 0 / 0
07.07.2015, 11:16
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001167
SharuPoNemnogu
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SharuPoNemnogu
Участник
skyANA,

согласен, лучше будет
...
Рейтинг: 0 / 0
07.07.2015, 11:19
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001175
SharuPoNemnogu
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SharuPoNemnogu
Участник
А если разметку не трогать, то лучше наверно массив параметров передать, вместо n-вызовов
...
Рейтинг: 0 / 0
07.07.2015, 11:24
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001745
Малыш456
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Малыш456
Гость
krvsaСитуация стандартная - на новых элементах просто нет обработчиков.
И выходы из нее стандартные:
- использовать делегирование
- каждый раз после загрузки вешать обработчики
А как повесить обработчик после загрузки?
...
Рейтинг: 0 / 0
07.07.2015, 19:17
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001758
Малыш456
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Малыш456
Гость
skyANAИМХО напрашивается использование data-атрибутов, а не предложенное решение.
можно подробнее.
...
Рейтинг: 0 / 0
07.07.2015, 19:38
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001811
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Малыш456skyANAИМХО напрашивается использование data-атрибутов, а не предложенное решение.
можно подробнее.
Пожалуйста:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <script data-require="jquery" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>
  <div class="load-something-on-click" data-target="#container1" data-url="tarif.php" id="kn1">kn1</div>
  <div class="load-something-on-click" data-target="#container1" data-url="services.php" id="kn2">kn2</div>
  <div class="load-something-on-click" data-target="#container2" data-url="calculator1.php" id="kn3">kn3</div>
  <div id="container1"></div>
  <div id="container2"></div>
  <script>
    function onLoadSomethingClick() {
      var sender = $(this), target = sender.data('target'), url = sender.data('url');
      
      $(target).load(url);
    }
    
    $('body').on('click', '.load-something-on-click', onLoadSomethingClick);
  </script>
</body>
</html>
...
Рейтинг: 0 / 0
07.07.2015, 21:20
| Ответить | Цитировать | Написать  
jQuery, AJAX.
    #39001952
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Малыш456А как повесить обработчик после загрузки?
Так же как и "до" загрузки, только после нее...
...
Рейтинг: 0 / 0
08.07.2015, 08:20
| Ответить | Цитировать | Написать  
13 сообщений из 13, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jQuery, AJAX.
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=39001030&tid=1445884]:
 0ms
get settings:
 11ms
get forum list:
 16ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 214ms
get topic data:
 10ms
get forum data:
 3ms
get page messages:
 56ms
get tp. blocked users:
 2ms
others: 239ms
total:  559ms
созд. / загр.: 559ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]