Спеціальні події в HTML, Javascript

Я хочу створити спеціальну подію в HTML, JS.

<input type="text" oncustombind="foo(event);" />

Як створити таке? "oncustombind" - це спеціальна подія, яку я хочу створити. Я повинен мати можливість викликати функцію/код, визначений в атрибуті oncustombind. Крім того, мені потрібно передати деякі дані об'єкту події.

Я не хочу використовувати будь-які бібліотеки, такі як jquery, YUI.

Будь-яка допомога буде глибоко оцінена.

6
Як вбудований JavaScript в HTML є великий брудний хак. Не робіть цього.
додано Автор Raynos, джерело
Оскільки питання було розміщено, час змінився. В даний час веб-компоненти стають життєздатним способом заміни JS фреймворків. Наявність вбудованих користувальницьких подій буде насправді дуже корисним для написання коду, який можна легко прочитати (подібно до кутового/реагування). Хороший прийом полягає в тому, щоб розділити цей контекст веб-компонента з елементом chidlren dom, використовуючи Object.assign . Таким чином, будь-який вибраний елемент Dom може мати доступ до методів, визначених у класі веб-компонентів. Було б ще краще мати доступ до спеціальних подій з вбудованих обробників подій.
додано Автор Adrian Moisa, джерело

2 Відповіді

You want a CustomEvent

Вони повинні бути простими в роботі, але підтримка браузера погана. Однак DOM-shim має виправити це.

var ev = new CustomEvent("someString");
var el = document.getElementById("someElement");
el.addEventListener("someString", function (ev) {
   //should work
});
el.dispatchEvent(ev);
9
додано

Неправильно застосовувати new Function і з , але це можна зробити так:/"rel =" nofollow "> http://jsfiddle.net/pimvdb/72GwE/13/ .

function trigger(elem, name, e) {
    var func = new Function('e',

      'with(document) {'
    + 'with(this) {'
    + elem.getAttribute('on' + name)
    + '}'
    + '}');

    func.call(elem, e);
}

З наступним HTML-кодом:

<input type="text" oncustombind="console.log(e, type, getElementById);" id="x">

потім ініціювати подію:

trigger(document.getElementById('x'), 'custombind', {foo: 123});
4
додано
в обсязі чого? Вікно , документ , elem та e вже знаходяться в області дії.
додано Автор Raynos, джерело
@pimvb ... Тому ми не використовуємо вбудовані обробники подій і брудні хаки. Кожний знає JavaScript у HTML є великий no-no.
додано Автор Raynos, джерело
додано Автор Raynos, джерело
код переривається в ES5-суворому. з не використовувалася належним чином
додано Автор Raynos, джерело
@Raynos: Що б ви використовували, щоб зробити вікно , документ , подія та e у рамці? Немає кращого способу, ніж з ...
додано Автор pimvdb, джерело
@Raynos: У атрибутах подій HTML можна отримати атрибути і функції document автоматично, наприклад, getElementById без попереднього документа. .
додано Автор pimvdb, джерело
@Raynos: Це повинно бути всередині самої функції, спасибі.
додано Автор pimvdb, джерело
@Raynos: Тоді, мабуть, не існує ручного способу зробити властивості документа доступними в області дії.
додано Автор pimvdb, джерело
ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram