В Chrome событие «поиск» запускается при поиске, когда пользователь нажимает кнопку очистки.
Есть ли способ зафиксировать одно и то же событие в javascript в Internet Explorer 10?
В Chrome событие «поиск» запускается при поиске, когда пользователь нажимает кнопку очистки.
Есть ли способ зафиксировать одно и то же событие в javascript в Internet Explorer 10?
Ответы:
Единственное решение, которое я наконец нашел:
// There are 2 events fired on input element when clicking on the clear button:
// mousedown and mouseup.
$("input").bind("mouseup", function(e){
var $input = $(this),
oldValue = $input.val();
if (oldValue == "") return;
// When this event is fired after clicking on the clear button
// the value is not cleared yet. We have to wait for it.
setTimeout(function(){
var newValue = $input.val();
if (newValue == ""){
// Gotcha
$input.trigger("cleared");
}
}, 1);
});
oninput
вместо этого событие. Когда вы нажимаете значок X, input
событие запускается.
if (oldValue === "")
?
input
-event работает, это решение превосходит его тем, что оно срабатывает только тогда, когда элемент был очищен, в то время как Lucent также срабатывает, когда курсор входит в элемент, покидает элемент, а также когда данные были введены.
oninput
Событие выстреливает с this.value
установленным в пустую строку. Это решило проблему для меня, так как я хочу выполнить одно и то же действие независимо от того, очищают ли они поле поиска с помощью X или путем возврата. Это работает только в IE 10.
inputEl.addEventListener('input', function(){ /* DoSomething */ })
.
input
Вместо этого используйте . Он работает с одинаковым поведением во всех браузерах.
$(some-input).on("input", function() {
// update panel
});
Почему бы и нет
$("input").bind('input propertychange', function() {
if (this.value == ""){
$input.trigger("cleared");
}
});
Я понимаю, что на этот вопрос был дан ответ, но принятый ответ не сработал в нашей ситуации. IE10 не распознал / не запустил$input.trigger("cleared");
инструкцию.
В нашем окончательном решении этот оператор был заменен событием нажатия клавиши ENTER (код 13). Для потомков в нашем случае сработало вот что:
$('input[type="text"]').bind("mouseup", function(event) {
var $input = $(this);
var oldValue = $input.val();
if (oldValue == "") {
return;
}
setTimeout(function() {
var newValue = $input.val();
if (newValue == "") {
var enterEvent = $.Event("keydown");
enterEvent.which = 13;
$input.trigger(enterEvent);
}
}, 1);
});
Кроме того, мы хотели применить эту привязку только к входам «поиска», а не ко всем входам на странице. Естественно, IE также усложнял это ... хотя мы кодировали <input type="search"...>
, IE отображал их как type="text"
. Вот почему селектор jQuery ссылается наtype="text"
.
Ура!
Мы можем просто послушать input
событие. Пожалуйста, смотрите ссылку для деталей. Вот как я исправил проблему с кнопкой очистки в Sencha ExtJS в IE:
Ext.define('Override.Ext.form.field.ComboBox', {
override: 'Ext.form.field.ComboBox',
onRender: function () {
this.callParent();
var me = this;
this.inputEl.dom.addEventListener('input', function () {
// do things here
});
}
});
Готовое решение - просто полностью избавиться от X с помощью CSS:
::-ms-clear { display: none; } /* see /programming/14007655 */
Это дает следующие преимущества:
для моего управления сервером asp.net
<asp:TextBox ID="tbSearchName" runat="server" oninput="jsfun_tbSearchName_onchange();"></asp:TextBox>
js
function jsfun_tbSearchName_onchange() {
if (objTbNameSearch.value.trim() == '')
objBTSubmitSearch.setAttribute('disabled', true);
else
objBTSubmitSearch.removeAttribute('disabled');
return false;
}
ссылка
Событие MSDN onchange - протестировано в IE10.
... или скрыть с помощью CSS:
input[type=text]::-ms-clear { display: none; }
Приведенный выше код не работал в моем случае, и я изменил одну строку и представил, $input.typeahead('val', '');
что работает в моем случае.
// There are 2 events fired on input element when clicking on the clear button:// mousedown and mouseup.
$("input").on('mouseup', function(e){
var $input = $(this),
oldValue = $input.val();
if (oldValue === ''){
return;
}
// When this event is fired after clicking on the clear button // the value is not cleared yet. We have to wait for it.
setTimeout(function(){
var newValue = $input.val();
if (newValue === ''){
$input.typeahead('val', '');
e.preventDefault();
}
}, 1);
});