Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Событие ended не работает с добавленными элементами

Приветствую!
Столкнулся с проблемой следующего содержания:
Есть блок с видео, которые подгружаются по запросу пользователя через ajax (заменяются) и мне по завершению видео нужно выводить сообщение с призывом ввести следующий запрос. Вот мой код:
$('body').on('ended','video',function(){
 $('#video_message').text('Введите запрос');
})

Однако событие ended не срабатывает.
Ответ: JetStar,
ставить обработку ended после ajax , на сам элемент, это событие не всплывает на верх.
Вопрос: Событие click не работает в firefox

В chrome работает в firefox нет.
Javascript
1
2
3
4
5
6
7
8
9
$(function() {
 
 
        $('#nav-icon').click(function() {
            $(this).toggleClass('open');
        });
 
 
});
Ответ: Все правильно. При клике по кнопке отрабатывает событие именно кнопки а не вложенных в нее элементов.

Если нужно установить класс внутреннего элемента то тогда лучше так сделать:
Javascript
1
2
3
$('.navbar-toggler').click(function() {
    $(this).find('#nav-icon').toggleClass('open');
});
Вопрос: Какой алгоритм поиска функции, что срабатывает по определённому событию?

Здравствуйте! Сейчас столкнулся с задачей - найти функцию, что выполняется при определённом событии, и привязать её к другому событию. Конкретнее - есть такой плагин для вордпресс - Contact Form 7. При нажатии кнопки submit - происходит валидация полей, и если она не пройдена - выскакивают подсказки, какие поля обязательные.
После повторного нажатия кнопки submit - все подсказки автоматически удаляются и валидация происходит заново. Мне нужно найти функцию, которая удаляет все эти подсказки. Как это правильно сделать?
Ответ: Можно на событие submit формы (либо на click кнопки) навесить обработчик, который будет удалять tooltips.
Главное, чтобы этот сценарий срабатывал после валидации формы.
Вопрос: AddEventListener не правильно работает с классами

Может немного некорректно тему назвал, но все же..

Давайте для начала приведу код..

function Block(){ 

	this.elem; 

	this.create = function(id){ 
		body.innerHTML += "<div id='"+id+"'></div>"; //бади написал просто что бы короче было 
		
		this.elem = document.getElementById(id); 

		this.elem.addEventListener("mousedown", function(){ 
			console.log("Pressed") // То, что должно печататься при нажатии на блок 
		},false); 
	}; 

};

// Далее создаем эти блоки 

var block1 = new Block(); 
var block2 = new Block(); 
block1.create(1); //Тут обработчик события не работает вообще (но если не создавать block2, то работать будет). 
block2.create(2); //Тут обработчик события привязывается и работает.

// Если изменить порядок create(), ничего не поменяется. У block1 вообще не работает обработчик после создания block2. Даже если перед созданием block2 сделать block1.create(). Оно будет работать только до тех пор, пока не будет создан block2.



То есть проблема в том, что если элемент был создан внутри класса, и там же назначен обработчик события, то при создании ещё одной копии класса, у прошлого перестает назначаться и работать обработчик..

Я уже пытался внутри класса отдельно вывести назначение обработчика. Так же пытался другие типы (onmousedown и даже attachEvent). Ничего не помогает.

Так же пытался вне класса назначить, но тут тоже интересная ситуация:

Код:
*Код класса, но без назначение обработчика при создании* 

var block1 = new Block(); 
block1.create(1); //Просто создаем блок 1. 

var block2 = new Block(); 
block2.create(2); //Просто создаем блок 2. 

console.log(block1.elem); // Выводит: <div id='1'></div>
console.log(block2.elem); // Выводит: <div id='2'></div>
console.log(document.getElementById(1)); // Выводит: <div id='1'></div>
console.log(document.getElementById(2)); // Выводит: <div id='2'></div>

// И так и так выводятся правильные элементы


Продолжение кода:

Вот как НЕ работает
block1.elem.addEventListener("mousedown", function(){console.log("Pressed")},false); // Не работает.
block2.elem.addEventListener("mousedown", function(){console.log("Pressed")},false); // Работает.


Вот так Работает
document.getElementById(1).addEventListener("mousedown", function(){console.log("Pressed")},false); // Работает.
document.getElementById(2).addEventListener("mousedown", function(){console.log("Pressed")},false); // Работает.


Непонятно мне, почему и block.elem и document.getElementById() выводят правильные значения, но при этом обработчик работает только на второй вариант. Кстати если внутри самого create() сделать не по this.elem, а так же по гетЭлемИд, то тоже не работает.

В общем-то не понимаю тут немного логики и прошу помощи. Подозреваю, что это все именно из-за классов, но что именно, не знаю.

Буду очень благодарен за помощь.
Ответ: рони,
Благодарю, теперь все работает.

Хотя единственное не понятно, почему во втором случае не работало, когда я эвенты биндил отдельно по block.elem, но по GetElementById работало.
Вопрос: событие onBeforePaste не работает

Доброго времени суток!
Суть задачи следующая: есть блок div с contenteditable='true'. Если пользователь будет вставлять в него информацию из буфера, то я хочу ее заранее очистить от всех html-тегов и в итоге вставить только текст.
Хотел реализовать это с помощью события onBeforePaste, но оно почему-то совсем отказывается срабатывать, вот элементарный пример: Chrome, Yandex, Safari и Лиса никак не отреагировали на вставку, а вот в Explorer на удивление все сработало.
Возможно что-то нужно сделать дополнительно чтобы скрипт был рабочим?! Может есть какой-нибудь удобный способ для реализации этой задачи?!
Заранее благодарю!)
Ответ: Nikel097, через oninput всё нужно делать, в нём уже отслеживаем какие изменения произошли, если содержимое изменилось не на один символ, то очевидно, что произошла вставка с буфера.
Вопрос: Как создать событие?

Скажите, пожалуйста. как назначить событие конкретному объекту в JAVAscript Нигде не могу найти. Хочу что б изменения одного поля передавались другому, ничего не выходит.

PHPHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
<head>
<FORM name="MyForm">
<INPUT type="text" name="TextBox1" onchange="Text1(this.value)">
<INPUT type="text" name="TextBox2">
<INPUT type="button" name="Кнопка">
</FORM>
<SCRIPT>
Function Text1()
{
MyForm.TextBox2.value = MyForm.TextBox1.value
}
</SCRIPT>
 
</head>
</html>
Ответ: Спасибо, прочту, он у меня тоже получилось, оказывается служебное слово function нельзя писать с заглавной буквой, так заработала:
PHPHTML
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
<html>
<head>
 
 
<FORM name="MyForm">
<INPUT type="text" name="TextBox1" onchange="Text1()">
<INPUT type="text" name="TextBox2">
<INPUT type="button" name="Кнопка">
</FORM>
 
 
<SCRIPT>
 
function Text1() 
{
 MyForm.TextBox2.value = MyForm.TextBox1.value
}
 
</SCRIPT>
 
 
 
 
</head>
</html>
Вопрос: клик и событие работает клик и это событие не работает

Всем доброго времени суток и позитивного настроения)))

Не могу придумать ребят помогите

в общем есть определенное событие например resize

$(window).resize(function() {
	alert($(window).height());
});

и так же есть два клика.
$('.open').click(function(){
    //тело события
});

$('.close').click(function(){
    //тело события
});

дело вот в чем. Когда мы нажимаем на блок с классом open то при ресайзе окна показывает alert

но после того как мы нажали на блок с классом close при изменение окна браузера это событие не должно работать.

я смог выкрутиться с помощью переменной т.е. при нажатии на open присваеваем значение переменной true а при закрытии false и проверяем на ресайзе значение переменной и уже думаем выводить нам или нет

работает но мне показалось это неким костылем может есть вариант какой по лучше!?

заранее огромное спасибо всем ответившим
Ответ: Большое спасибо))))
Вопрос: событие .on говорит нет такой функции

Всем Привет!
Для начала кусок кода:

$(document).ready(function () {
    var idProduct = 0;
    var idSize = 0;


  window.onload = function () {
            idProduct = getParammUrl("item");
            getAllSize(idProduct);
    };

function getAllSize(id) {
        $.ajax({
            type: "POST",
            url: "ServiceJson/WebServiceJson.asmx/getListSize",
            data: "{'idProduct':'" + idProduct + "'}",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (res) {
                $('#tableSize').empty();
                var item = res.d;

                var strAppend = "<tr>";
                strAppend += "<td style=\"width: 150px;\">Доступные размеры</td>";
                for (var i = 0; i < item.length; i++) {
                    strAppend += "<td id=\"" + idProduct + "_" + item[i]._idSizeProduct + "_borderSizeList\" >";
                    strAppend += "<div class=\"borderSizeList\">" + item[i]._nameSize + "</div>";
                    strAppend += "</td>";
                }
                strAppend += "</tr>";

                $("#tableSize").append(strAppend);

                $('.borderSizeList').on('click', function () {
                    getParammSize(this);
                });

            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    }

 function getParammSize(ctrl) {

        var nameId = "_";
        var arrPos = ctrl.id.split(nameId);

        var idProduct = arrPos[0];
        var idSize = arrPos[1];

        $.ajax({
            type: "POST",
            url: "ServiceJson/WebServiceJson.asmx/getSizeSett",
            data: "{'idProduct':'" + idProduct + "', idSize:'" + idSize + "'}",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (res) {
                $('#tableParamm').empty();

                var item = res.d;

                for (var i = 0; i < item._listParamm.length; i++) {
                    $("#tableParamm").append("<tr><td style=\"width:200px;\">" + item._listParamm[i]._nameParamm + "</td><td style=\"width:200px;\">" + item._listParamm[i]._value + "</td></tr>");
                }
            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    }

});



Проблема в следующем. На строке "$('.borderSizeList').on('click', function () {" Yandex браузер в отладчике падает сообщая об ошибке "Uncaught TypeError: $(...).on is not a function"

Изначально класс borderSizeList принадлежал ячейке таблицы, но я уже не зная что делать подумал, что у ячейки нет такого события и поместил в неё div. Результат тот же. На другой станице у меня абсолютно такая же ситуация, но там работает нормально, событие привязывается и работает, а на этой нет. Класс borderSizeList нигде кроме этой странице в пределах создаваемой таблицы не задействован.

В чем может быть проблема? Заранее спасибо.
Ответ: Rus54, В общем подошла версия 1.7.2 .Пока проблема решена.
Вопрос: Событие по выбору элемента в списке, Jquery

Скрипт -

Вообще не хочет работать, как я ни пробовал. Особенность в том, что указанный select подгружается при открытии страницы в WP в div, то есть весь html по своей сути:
<div id="form59"></div>


В него подгружается содержимое файла

То есть все срабатывает в
jQuery(document).ready(function(){
[url]http://serhito.ru/mywork/59.js[/url]	
});

но не работает далее и ничего не могу сделать с этим самым событием, чтобы оно работало, при выборе в списке ничего не происходит
Ответ: p.s. Ошибок нет - логи чистые...
Вопрос: По событию OnClick не вызывается обработчик на Javascript

Здравсивуйте. Помогите, пожалуйста, разобраться в проблеме. При нажатии на кнопку button ее событие OnClisk не работает. Вот ссылка на
страницу
Чтобы перейти к проблемной кнопке нужно выбрать в меню Тест1, ариает1 и нажать самую первую кнопку проверить. В поле ввода должны появиться 111. Если кто-то поможет буду очень благодарна, так как уже очень долго не могу понять в чем дело.
Ответ:
Сообщение от Fotinia
нужно ввести число от 1 до 4.
Я не этого ожидал. У вас множество различных формул, а тест, это проверка ввода диапазона от 1 до 4, и для всех форм?

Насколько можно понять, в поле вводится вариант ответа, и да 1 - 4, но как быть с задачей 6, где нет вариантов? И кто решает что ответ верен - сервер после отправки формы или же клиент?