Подтвердить что ты не робот

Как программно принудительно включить событие onchange на входе?

Как программно принудительно включить событие onchange на входе?

Я пробовал что-то вроде этого:

var code = ele.getAttribute('onchange');
eval(code);

Но моя конечная цель - запустить любые функции прослушивателя, и это, похоже, не сработает. Также не обновляется атрибут value.

4b9b3361

Ответ 1

ugh не использует eval для чего-либо. Ну, есть определенные вещи, но они крайне редки. Скорее, вы сделали бы это:

document.getElementById("test").onchange()

Посмотрите здесь дополнительные параметры: http://jehiah.cz/archive/firing-javascript-events-properly

Ответ 2

В jQuery я в основном использую:

$("#element").trigger("change");

Ответ 3

Создайте объект Event и передайте его методу dispatchEvent элемента:

var element = document.getElementById('just_an_example');
var event = new Event('change');
element.dispatchEvent(event);

Это вызовет прослушиватели событий независимо от того, были ли они зарегистрированы, вызвав метод addEventListener или установив свойство onchange этого элемента.


Если вы хотите, чтобы событие пузырилось, передайте второй аргумент конструктору Event:

var event = new Event('change', { bubbles: true });

Информация об совместимости браузера:

Ответ 4

По какой-то причине ele.onchange() выбрасывает "метод не найден" для меня в IE на моей странице, поэтому я использовал эту функцию из ссылки Kolten предоставил и вызвал fireEvent (ele, 'change'), который работал:

function fireEvent(element,event){
    if (document.createEventObject){
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else{
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}

Однако я создал тестовую страницу, которая подтвердила, что вызов должен работать onchange():

<input id="test1" name="test1" value="Hello" onchange="alert(this.value);"/>
<input type="button" onclick="document.getElementById('test1').onchange();" value="Say Hello"/>

Изменить: причина, по которой ele.onchange() не работает, была потому, что я фактически ничего не объявлял для события onchange. Но fireEvent все еще работает.

Ответ 5

Взято снизу QUnit

function triggerEvent( elem, type, event ) {
    if ( $.browser.mozilla || $.browser.opera ) {
        event = document.createEvent("MouseEvents");
        event.initMouseEvent(type, true, true, elem.ownerDocument.defaultView,
            0, 0, 0, 0, 0, false, false, false, false, 0, null);
        elem.dispatchEvent( event );
    } else if ( $.browser.msie ) {
        elem.fireEvent("on"+type);
    }
}

Вы можете, конечно, заменить материал $.browser на свои собственные методы обнаружения браузера, чтобы сделать его независимым от jQuery.

Чтобы использовать эту функцию:

var event;
triggerEvent(ele, "change", event);

В основном это приведет к реальному событию DOM, как если бы что-то действительно изменилось.

Ответ 6

С помощью JQuery вы можете сделать следующее:

// for the element which uses ID
$("#id").trigger("change");

// for the element which uses class name
$(".class_name").trigger("change");

Ответ 7

Если вы используете jQuery, у вас будет:

$('#elementId').change(function() { alert('Do Stuff'); });

или MS AJAX:

$addHandler($get('elementId'), 'change', function(){ alert('Do Stuff'); });

Или в необработанном HTML-элементе:

<input type="text" onchange="alert('Do Stuff');" id="myElement" />

После повторного чтения вопроса, я думаю, что пропустил прочтение того, что должно было быть сделано. Я никогда не нашел способ обновить элемент DOM таким образом, который заставит событие изменения, что вам лучше всего делать, это иметь отдельный метод обработчика событий, например:

$addHandler($get('elementId'), 'change', elementChanged);
function elementChanged(){
  alert('Do Stuff!');
}
function editElement(){
  var el = $get('elementId');
  el.value = 'something new';
  elementChanged();
}

Поскольку вы уже пишете JavaScript-метод, который будет изменять его только 1 дополнительную строку для вызова.

Или, если вы используете фреймворк Microsoft AJAX, вы можете получить доступ ко всем обработчикам событий через:

$get('elementId')._events

Это позволит вам выполнить некоторые действия в стиле отражения, чтобы найти подходящий обработчик событий для запуска.