Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
 
Рейтинг 4.79/29: Рейтинг темы: голосов - 29, средняя оценка - 4.79
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492

Отменить событие onclick у родительского элемента

25.02.2016, 21:13. Показов 5936. Ответов 21
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Имеем:
HTML5
1
2
3
<div id="value" onclick="FunctionA()">
<input id="value" onclick="FunctionB()"></div>
</div>
Вопрос:
Как, при клике на input отменить срабатывание onclick="FunctionA()"?
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
25.02.2016, 21:13
Ответы с готовыми решениями:

Как получит текст из элемента на котором произошло событие 'onclick'?
window.onload=function (e) { var user=e.currentTarget; var name; ...

С помощью onclick в alert вывести индекс элемента на котором сработало событие
Имеется много элементов типа &lt;td class=&quot;myClass&quot;&gt;&lt;/td&gt; &lt;td class=&quot;myClass&quot;&gt;&lt;/td&gt; &lt;td class=&quot;myClass&quot;&gt;&lt;/td&gt; ...

Как отменить срабатывание onClick при выделении текста
У меня есть таблица, каждая строка которой (&lt;tr&gt;) сделана ссылкой (с помощью события onClick). К сожалению, при выделении текста в...

21
6 / 6 / 2
Регистрация: 05.08.2015
Сообщений: 42
25.02.2016, 21:23
ну первое что на ум пришло, проверка id элемента и выход если это родитель
0
Hello Kitty
 Аватар для WhiteMind
690 / 562 / 402
Регистрация: 12.02.2016
Сообщений: 1,436
Записей в блоге: 1
25.02.2016, 21:42
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div id="value" onclick="FunctionA()" style="width: 200px; background: #424345;">
    <input id="value" onclick="FunctionB()" />
</div>
 
<script>
 
function FunctionA() {
    alert( 'call FunctionA' );
}
function FunctionB() {
    event = event || window.event;
    var t = event.target || event.srcElement;
 
    var oldF = t.parentElement.onclick;
    t.parentElement.onclick = function () {
        t.parentElement.onclick = oldF;
    };
    
    alert( 'call FunctionB' );
}
 
</script>
Добавлено через 14 секунд
https://jsfiddle.net/605uwaup/
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
25.02.2016, 21:48  [ТС]
WhiteMind, В вашем примере постоянно срабатывает FunctionA()

Добавлено через 49 секунд
bobrzzz, я не понял, можете по подробнее?
0
Hello Kitty
 Аватар для WhiteMind
690 / 562 / 402
Регистрация: 12.02.2016
Сообщений: 1,436
Записей в блоге: 1
25.02.2016, 21:53
Цитата Сообщение от Zazu Посмотреть сообщение
WhiteMind, В вашем примере постоянно срабатывает FunctionA()
какой браузер

Добавлено через 4 минуты
https://jsfiddle.net/605uwaup/1/

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div id="value" onclick="FunctionA()" style="width: 200px; background: #424345;">
    <input id="value" onclick="FunctionB(this)" />
</div>
 
<script>
 
function FunctionA() {
    alert( 'call FunctionA' );
}
function FunctionB(t) {
    var oldF = t.parentElement.onclick;
    t.parentElement.onclick = function () {
        t.parentElement.onclick = oldF;
    };
    
    alert( 'call FunctionB' );
}
 
</script>
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
26.02.2016, 13:59  [ТС]
WhiteMind, я пользуюсь FireFox-ом, если не сложно прокомментируйте FunctionB() пожалуйста!!
что вы в ней изменили?

Добавлено через 15 часов 35 минут
а почему return false не помогает?
0
Hello Kitty
 Аватар для WhiteMind
690 / 562 / 402
Регистрация: 12.02.2016
Сообщений: 1,436
Записей в блоге: 1
26.02.2016, 14:27
https://jsfiddle.net/605uwaup/1/
в лисе у меня работает
0
21 / 21 / 5
Регистрация: 02.04.2015
Сообщений: 63
26.02.2016, 15:27
Используйте разные ID, не могут быть одновременно два ID. и привязуйте онклик на определенный ИД.
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
26.02.2016, 15:33  [ТС]
silvershadow, тоесть так?
JavaScript
1
2
3
$("#id").click(function() {
 
});
0
21 / 21 / 5
Регистрация: 02.04.2015
Сообщений: 63
26.02.2016, 15:40
да. только в штмл атрибутах не забудьте прописать разные ИД. а для тега а - return false; в конце.

Добавлено через 4 минуты
аа. и еще. зыбыл написать.
у вас кнопка внутри дива. и когда вы нажимаете кнопку под фокусом находится и див и тригеры сработают и от него. поэтому, все таки, отделить отдельно в штмл тег кнопку и дива.

напишите, почему вы так написали, какая необходимость?
0
 Аватар для Goga5
61 / 39 / 20
Регистрация: 06.12.2015
Сообщений: 155
26.02.2016, 16:13
У меня тоже работает пример WhiteMinda.

Добавлено через 32 минуты
Ееееееееееееееееее! Заработало наконец-то!
HTML5
1
2
3
<div id="value1" style="width: 500px; height: 200px; border:5px solid red;">
<input id="value2">
</div>
JavaScript
1
2
3
4
5
6
7
8
9
var Srabotalo = false;
function FA(){
if(Srabotalo) {Srabotalo = false; return;};
//Ваш код функции А.
console.log("Сработала функция FA()");} 
function FB(){
Srabotalo = true;
//Ваш код функции B.
console.log("Сработала функция FB()");}
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
26.02.2016, 17:29  [ТС]
silvershadow, я делаю выбор нескольких фото:

на скрин посмотрите!

когда кликаешь на фото, то открываетсь просто просмотр изображения, через "галерею" так скажем, а когда нажимаешь на input, то должна поставиться/сняться галочка и добавиться/удалиться в массиве адрес фото, но у меня при клике на input срабатывают сразу две.

я пытался сначала сделать так
JavaScript
1
2
3
$("input#val").click(function() {
 
});
но нечего не срабатывало к сожалению, почему не смог понять, даже несколько раз переписывал функции но безрезультатно! наверное всё дело в .load()
Миниатюры
Отменить событие onclick у родительского элемента  
0
21 / 21 / 5
Регистрация: 02.04.2015
Сообщений: 63
27.02.2016, 02:20
Zazu, Попробуйте такую логику. поставьте функцию что запускает просмотр изображение при клике на изображение или на ссылку на изображений (если есть такое), и не ставьте никаких тригерров на инпут чекбоксы. после в каждый чекбокс поставьте атрибут value с адрес фото, после чего, пускай будет кнопка, которая запустит уже функцию, которая проверит каждый чекбокс, и если он :checked, тогда в массив добавляется адрес фото из атрибута value, а уже с этим массивом делайте что пожелаете.
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
27.02.2016, 03:59  [ТС]
silvershadow, вот как выглядит одно изображение из скрина
PHP
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
    for ($n = $from; $n < $before; ++$n)
    {
        $file = mysql_result($result, $n, 'photo');
        $src = "photos/$id/$album/$file";
        echo '<div align="center" onclick="LookPhoto(\''.$file.'\')" style="width:103px; height:90px; float:left; position:relative; overflow:hidden; margin:5px 0 0 10px">';
        $size = getimagesize($src);
        if ($size[0] > $size[1])
        {
            $mar = ((round(90 / $size[1] * $size[0]) - 103) / 2);
            echo '<img src="'.$src.'" style="margin-left:-'.$mar.'px; height:90px">';
        }
        else if ($size[0] < $size[1])
        {
            $mar = ((round(103 / $size[0] * $size[1]) - 90) / 2);
            echo '<img src="'.$src.'" style="margin-top:-'.$mar.'px; width:103px">';
        }
        else
        {
            $mar = ((round(103 / $size[0] * $size[1]) - 90) / 2);
            echo '<img src="'.$src.'" style="margin-top:-'.$mar.'px; width:103px">';
        }
        echo    '<div id="box-click-photos">
                    <input id="inp'.$n.'" class="inp-check-photo" onclick="ClickInput(this.id)" type="checkbox" value="'.$src.'" />
                </div>
            </div>';
    }
Добавлено через 2 минуты
Тоесть у меня onclick уже привязан не к <img src="" />,
или может я вас не совсем понял!

Добавлено через 12 минут
а, я вас понял, вы хотите сказать не ставить onclick на input, только я сомневаюсь что если я уберу onclick с input то просмотр изображения не будет запускаться! куда тогда вы предлагаете поместить onclick для просмотра изображения?
0
 Аватар для Goga5
61 / 39 / 20
Регистрация: 06.12.2015
Сообщений: 155
27.02.2016, 10:28
Используйте метод WhiteMinda - хороший метод. И получше разберитесь с событиями. Читайте вот здесь:
http://javascript.ru/tutorial/... abotchikov.
0
21 / 21 / 5
Регистрация: 02.04.2015
Сообщений: 63
27.02.2016, 11:59
Zazu,
для просмотра изображения поставьте на сам img
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
27.02.2016, 15:51  [ТС]
WhiteMind, Не получается сделать как вы говорите, дела так:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function ClickInput(obj, size) {
    var oldF = obj.parentElement.onclick;
    obj.parentElement.onclick = function () {
        obj.parentElement.onclick = oldF;
    };
    if ($(obj).is(':checked')) {
        if (arrayPhotosNewMagnets.length === 0) arrayPhotosNewMagnets = [];
        arrayPhotosNewMagnets.push($(obj).val());
        arrayPhotosSizeNewMagnets.push(size);
    }
    else {
        var key = $.inArray($(obj).val(), arrayPhotosNewMagnets);
        arrayPhotosNewMagnets.splice(key, 1);
        arrayPhotosSizeNewMagnets.splice(key, 1);
        if (arrayPhotosNewMagnets.length === 0) arrayPhotosNewMagnets = new Array(0);
    }
    console.log(arrayPhotosNewMagnets);
    console.log(arrayPhotosSizeNewMagnets);
}
и при нажатии на инпут всё равно фотки открываются!
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
27.02.2016, 15:58  [ТС]
silvershadow, вся сложность в том, что у меня изображения выходят за рамки одного окошка, (посмотрите скрин, синем выделен тег img, он просто спрятан), так что если я привяжу к img onclick получется так скажем Жесть!!
Миниатюры
Отменить событие onclick у родительского элемента  
0
21 / 21 / 5
Регистрация: 02.04.2015
Сообщений: 63
27.02.2016, 18:51
Zazu, каждый ваш img имеет родительский див. поставьте ему css свойство - overflow:hidden и все будет нормально.
0
24 / 24 / 8
Регистрация: 27.02.2012
Сообщений: 492
27.02.2016, 23:45  [ТС]
silvershadow, уже стоит!!

Добавлено через 4 часа 23 минуты
Я пока что div-ами снизу и слева от инпута облепил о на них повесил открытие фотографий!
Жду ваших предложений по решению данной проблемы!
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
27.02.2016, 23:45
Помогаю со студенческими работами здесь

Событие onclick
Ребята я у меня наверно самый глупый вопрос, но блин пытался по разному вписать не получилось. В общем есть форма &lt;form...

Событие onclick.
Здравствуйте. Столкнулся с проблемой на одном из сайтов для проведения чемпионатов. Так вот, там существует механизм подтверждения участия:...

Не работает событие onclick
Не работает событие onclick в radio. При нажатии на элементы radio не запускается функция, можете помочь? &lt;form...

Не работает событие onclick
Собственно говоря у меня есть в хтмле код: &lt;script src=&quot;javascript.js&quot;&gt;&lt;/script&gt; &lt;input type=&quot;button&quot; id=&quot;Doctyp&quot;...

Событие onclick не работает
Помогите, пожалуйста, разобраться. Не могу понять почему не работает: &lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
20
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли
8Observer8 30.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm
8Observer8 30.01.2026
Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .
SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 29.01.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT
bedvit 28.01.2026
Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 28.01.2026
Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru