powered by simpleCommunicator - 2.0.59     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / drag drop click firefox
19 сообщений из 19, страница 1 из 1
drag drop click firefox
    #39139072
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
https://jsfiddle.net/qckkd7r8/
если тащу за ссылку, то после отпускания в фф срабатывает клик по ссылке, в хроме этого нету
как исправить?
пытался вызвать в событии drop ev.stopPropagation(); но не помогает
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139263
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyiloda https://jsfiddle.net/qckkd7r8/
если тащу за ссылку, то после отпускания в фф срабатывает клик по ссылке, в хроме этого нету
как исправить?
пытался вызвать в событии drop ev.stopPropagation(); но не помогает

нужно остановить "всплытие" (stopPropagation) события клика по .min-hd и предотвратить выполнение действия по умолчанию со стороны браузера (preventDefault):
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
$(".drag_box").droppable({
        activate: function( event, ui ) {
            drag_box_num = ui.draggable.parents('.draggable-list').attr('box_num');
            is_drag = true;

            $('.min-hd').on('click', function(e){
               e.stopPropagation();
               e.preventDefault();
            });
        },
        drop : function(ev, ui) {

            var box_num= $(this).find('.draggable-list').attr('box_num');
            $('form input[name="box_num"]').val(box_num);

            if (box_num == drag_box_num) {
                return false;
            }

            var lead_id = ui.draggable.attr('lead_id');

            $('form input[name="lead_id"]').val(lead_id);

            return false;
        }
    });
    
    $('.ajax').on('click', function(){

        alert('bam!');

        return false;

    });
    
    $('.drag_box .items').sortable({
        //connectWith: '.box-min .draggable-list .items',
    });
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139272
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
не относится к сабжу, но вот такой фрагмент кода, является не валидным, с точки зрения спецификации html5 тег a может содержать только строчные элементы, а div является блочным элементом, потому, желательно заменить div например на span:
Код: html
1.
2.
3.
    <a class="ajax" href="/lead/38">
        <div class="min-hd">test</div>
    </a>



тынц на спецификацию
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139295
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,
теперь после дропа не работает клик по ссылке
у меня по клику по ссылке всплывает диалог, но нужно чтобы после дропа он не всплывал
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139328
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyilodaТshаmil,
теперь после дропа не работает клик по ссылке
у меня по клику по ссылке всплывает диалог, но нужно чтобы после дропа он не всплывал

Нужно обработать событие deactivate у droppable, и отвязать обработку события клика:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
$(".drag_box").droppable({
        activate: function( event, ui ) {
            drag_box_num = ui.draggable.parents('.draggable-list').attr('box_num');
            is_drag = true;
            
            $('.min-hd').on('click', function(e){
               e.stopPropagation();
               e.preventDefault();
            });
        },
        deactivate: function(e, ui){
        		$('.min-hd').unbind('click');
        },
        drop : function(ev, ui) {

            var box_num= $(this).find('.draggable-list').attr('box_num');
            $('form input[name="box_num"]').val(box_num);

            if (box_num == drag_box_num) {
                return false;
            }

            var lead_id = ui.draggable.attr('lead_id');

            $('form input[name="lead_id"]').val(lead_id);
            
            return false;
        }
        
    });
    

    
    $('.drag_box .items').sortable({
        //connectWith: '.box-min .draggable-list .items',
    });



автору меня по клику по ссылке всплывает диалог, но нужно чтобы после дропа он не всплывал
ты ведь переопределил клик, поэтому и всплывает, нужно просто убрать этот код:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
    $('.ajax').on('click', function(){

        alert('bam!');

        return false;

    });
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139341
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,

таже фигня, после дропа клик по ссылке перестает перехватываться

я может плохо объяснил
у меня есть элемент с заголовком-ссылкой, при клике по ссылке всплывает модальное окно с содержимым ссылки
также этот итем можно перетащить в другое место страницы. так вот если тащить за заголовок и бросить, то вылазит диалог хотя по задумке диалог не должен вылазить. в хроме все так и работает. после дропа клик не всплывает
а в фф такая фигня
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139371
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyilodaТshаmil,

таже фигня, после дропа клик по ссылке перестает перехватываться

я может плохо объяснил
у меня есть элемент с заголовком-ссылкой, при клике по ссылке всплывает модальное окно с содержимым ссылки
также этот итем можно перетащить в другое место страницы. так вот если тащить за заголовок и бросить, то вылазит диалог хотя по задумке диалог не должен вылазить. в хроме все так и работает. после дропа клик не всплывает
а в фф такая фигня
если на вскидку то это можно сделать так:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
var clickByHref = function(){
        alert('bam!');
        return false;
};

$(".drag_box").droppable({
        activate: function( event, ui ) {
            drag_box_num = ui.draggable.parents('.draggable-list').attr('box_num');
            is_drag = true;
            
            $('.ajax').unbind('click');
            $('.min-hd').on('click', function(e){
               e.stopPropagation();
               e.preventDefault();
            });
        },
        deactivate: function(e, ui){
        		$('.min-hd').unbind('click');
            $('.ajax').mouseup(function(e){
               
               $('.ajax').bind('click', clickByHref);
               e.preventDefault(e);
            });
            $('.ajax').unbind('click');   
        },
        drop : function(ev, ui) {

            var box_num= $(this).find('.draggable-list').attr('box_num');
            $('form input[name="box_num"]').val(box_num);

            if (box_num == drag_box_num) {
                return false;
            }

            var lead_id = ui.draggable.attr('lead_id');

            $('form input[name="lead_id"]').val(lead_id);
            
            return false;
        }
        
    });
    
    $('.ajax').click(clickByHref);
    
    $('.drag_box .items').sortable({
        //connectWith: '.box-min .draggable-list .items',
    });


но если подумать, то можно сделать более оптимально.
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139378
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ошибся, вот так правильней:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
var clickByHref = function(){
        alert('bam!');
        return false;
};

$(".drag_box").droppable({
        activate: function( event, ui ) {
            drag_box_num = ui.draggable.parents('.draggable-list').attr('box_num');
            is_drag = true;
            
            $('.ajax').unbind('click');
            $('.min-hd').on('click', function(e){
               e.stopPropagation();
               e.preventDefault();
            });
        },
        deactivate: function(e, ui){
        		$('.min-hd').unbind('click');
            $('.ajax').mouseup(function(e){
               $('.ajax').bind('click', clickByHref);
               $('.ajax').unbind('mouseup');
               e.preventDefault(e);
            });
            
        },
        drop : function(ev, ui) {

            var box_num= $(this).find('.draggable-list').attr('box_num');
            $('form input[name="box_num"]').val(box_num);

            if (box_num == drag_box_num) {
                return false;
            }

            var lead_id = ui.draggable.attr('lead_id');

            $('form input[name="lead_id"]').val(lead_id);
            
            return false;
        }
        
    });
    
    $('.ajax').click(clickByHref);
    
    $('.drag_box .items').sortable({
        //connectWith: '.box-min .draggable-list .items',
    });
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139386
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,

еще хуже- постоянно растет количество алертов

меня больше интересует-это баг или фича? я гуглил но не смог найти этот случай
обычно рекомендуют при начале перетягивания установить флаг тру, при клике проверить если флаг установлен то выйти
но в хроме после дропа флаг не сбрасывается и поэтому первый клик по ссылке не срабатывает
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139423
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyilodaТshаmil,

еще хуже- постоянно растет количество алертов

меня больше интересует-это баг или фича? я гуглил но не смог найти этот случай
обычно рекомендуют при начале перетягивания установить флаг тру, при клике проверить если флаг установлен то выйти
но в хроме после дропа флаг не сбрасывается и поэтому первый клик по ссылке не срабатывает
где растет количество алертов, в хроме или в фф?
это особенность обработки событий, в таких случая нужно с помощью кода контролировать порядок всплытия событий.
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139425
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
проверил в хроме и фф https://jsfiddle.net/qckkd7r8/6/ никакого возрастания количества алертов нет
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139430
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
сори, вот, не сохранил изменения https://jsfiddle.net/qckkd7r8/7/
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139436
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вот это точно работает https://jsfiddle.net/qckkd7r8/8/
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139457
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,

спасибо, счас работает
а все же что это было с кликом и перетягиванием?
разве логично что после перетягивания всплывает клик?
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139470
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyilodaТshаmil,

спасибо, счас работает
а все же что это было с кликом и перетягиванием?
разве логично что после перетягивания всплывает клик?
клик это нажал и отпустил кнопку. Когда ты нажимаешь и начинаешь тащить элемент, клик еще не сработал, срабатывает только событие mousedown, далее ты тащишь элемент, и отпускаешь мышку, срабатывает mouseup и click. Все логично, тут скорее поведение хрома не совсем логично, скорее всего одна из библиотек на каком то этапе, в хроме, останавливает всплытие события и твой клик локализуется на <div class="min-hd">test</div> и до ссылки не добирается. Но повторюсь, в таких случаях, всегда желательно контролировать процесс самостоятельно, тогда можно быть уверенным, что все будет работать как нужно во всех браузерах.
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139509
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,

https://jsfiddle.net/qckkd7r8/ тут только 2 либы и такое же поведение в хроме, врядли ктото стопорит
плюс не пойму почему вызов stopPropagation и preventDefault в drop не срабатывает
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139523
Фотография Тshаmil
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tadeyilodaТshаmil,

https://jsfiddle.net/qckkd7r8/ тут только 2 либы и такое же поведение в хроме, врядли ктото стопорит
плюс не пойму почему вызов stopPropagation и preventDefault в drop не срабатывает
ты можешь убрать код который я дописал, и проследить последовательность всплытия события просто напечатав в консоль всю цепочку вызова, а потом сравнить ее в разных браузерах.

авторплюс не пойму почему вызов stopPropagation и preventDefault в drop не срабатывает
потому что событие drop это событие плагина dropable для него нет аналогов у браузерных событий. оно срабатывает когда ты во время перетаскивания элемента
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139543
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Тshаmil,

http://imgur.com/a/Aqjto вот цепочка вызовов, причем некоторые вызываются по нескольку раз
в хроме до клика не доходит
...
Рейтинг: 0 / 0
drag drop click firefox
    #39139552
tadeyiloda
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
если убрать строку $('.drag_box .items').sortable(); то перетаскиваться элементы не будут
если потянуть за заголовок в фф, клика тоже не будет
...
Рейтинг: 0 / 0
19 сообщений из 19, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / drag drop click firefox
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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