As per the MDN docs, a click event should have a property called preventedDefault: https://developer.mozilla.org/en-US/docs/Web/API/Event/defaultPrevented
However, in my code, defaultPrevented is undefined (Chrome and Safari). Instead there is another property called: isDefaultPrevented which seems to do the trick, however, this does not work in iOS Safari.
$('a').click(function(event) {
event.isDefaultPrevented; // returns true in Chrome (if event.preventDefault() was called)
event.defaultPrevented; // the "correct" way to do it as per MDN docs, however, it doesn't work in Chrome nor iOS.
});
This is the way to do it, if you're using jQuery.
$('a').click(function(event) {
event.originalEvent.defaultPrevented; // aparently jQuery will alter the event property, but it stores everything in 'originalEvent'
});
Related
I want to debounce a keyup event on a table of rows which causes an AJAX call. I have used all debouncing plugins out there, including the one for jQuery by Ben Alman, the one from Underscore.js, the jQuery delayed() plugin, as well as one plugin from Filatov Dmitry which extends jQuery (like Ben Alman's).
My code looks like this:
function onKeyUp(evt) {
doSomethingWith(evt, true);
}
$('#mytable').on('keyup', $.debounce(500, onKeyUp));
The problem is that, while it works fine on Firefox and IE9, it doesn't work in IE8. Specifically, IE8 throws a "Member not found" error when I call evt.preventDefault() which goes into the jQuery 1.11.1 code and breaks in line 4967 on e.returnValue = false; (because preventDefault() apparently doesn't exist in IE8). Upon inspection of the event variable with the IE developer tools debugger, it seems that the variable contains all event member methods and properties, but most of them are marked as "Member not found".
I've alread tried this solution https://stackoverflow.com/a/3533725/134120 but it did not work.
Googling for "IE member not found" returns a lot of results, but not many solutions.
So, any ideas?
I need to first prevent the default handler (i.e. no scrolling) and then debounce my event handler.
Then use this:
var onKeyUp = $.debounce(500, doSomethingWith);
$('#mytable').on('keyup', function(evt) {
evt.preventDefault(); // do always
onKeyUp(evt, true); // possibly bounced call to doSomethingWith
});
In FF and Chrome i can set the this value to the location object using bind, with the following code
locationFacade ={
reload: location.reload.bind(location)
}
locationFacade.reload();
Or I can use apply
locationFacade ={
reload: function(){
location.reload.apply(location,arguments); }
}
locationFacade.reload();
However in IE 9 I keep getting "Invalid calling object" when calling locationFacade.reload(); I havent tested every IE but issue happens in IE 11 also. Apply and bind are both supported in IE here and here
This problem seems to be a bug of IE. I tested lots of functions in IE11 (document.writeln, window.alert, etc.), and all of them could be bound, except the members of location. This workaround might help:
locationFacade = {
reload: window.navigate ?
window.navigate.bind(window, location.href) :
location.reload.bind(location)
}
Can I check if a onresize method was set?
I've previously used:
$(window).resize(function() { /* ... */ });
Due a unknown bug in another library, onresize is not called anymore. After executing above line it works perfectly again. The method is invoked once. If I execute the line in the Firebug console again, the method is invoked twice.
I would like to write a workaround, which sets onresize as soon as it's "reseted".
I'm looking for something like that: (undefined or null)
if (window.onresize == undefined) { /* ... */ }
The external library/framework is Richfaces 4 (Extended Data Table). As soon as I sort a column, some of the onresize function handler were gone.
Before:
$._data(window,'events').resize
// result on the Chrome console:
[Object, Object, Object, Object]
After using sorting:
$._data(window,'events').resize
// result on the Chrome console:
[Object]
I'm looking for a way to write a workaround.
JIRA Issue
https://issues.jboss.org/browse/RF-13117 (fixed with future release 4.3.4)
You could use $._data() which is not a method publicly supported:
$(window).on('load',function() {
if(!$._data(window,'events').resize)
alert('none resize bound');
});
In older jquery version it was: $.data()
what i used in my project was
$(window).unbind('resize').bind('resize',function(){
//code here
});
it will remove all the previously bind (registered) handlers for resize event and register this new function as the handler.
this approach is useful only when you want to attach a single event handler.
Thanks for all answers and comments. As suggested I went to the source of the problem and wrote for that a workaround including opening an issue.
window.RichFaces.ui.ExtendedDataTable.prototype.deActivateResizeListener = function() {
if (this.resizeEventName != undefined) {
$(window).off(this.resizeEventName);
}
};
I accepted roasted answer since it really helped to find a workaround and his answer answered my question if there is a way to find out if a event handler is attached.
I have a fairly simple ASP.NET page that renders an HTML input (text box). Within the generated HTML, I attach a handler to several events, including onfocus, onkeypress, and onkeyup. Because this is a solution targeted at a version of IE that does not support addEventListener (situation about which I can do nothing), I am forced to use attachEvent.
A typical call to attachEvent is as follows - I've excerpted this source from the original for the sake of brevity/clarity, so it is not precisely the code at issue:
var hostControl = document.getElementById('mytextbox');
var attachResult = hostControl.attachEvent('onfocus', function(){
hostControl.select();
});
if (!attachResult)
{
alert('Attach failed.');
}
attachResult = hostControl.attachEvent('onblur', function(){
if (hostControl.value=='')
{
alert('Warning - no entry.');
}
});
if (!attachResult)
{
alert('Attach failed.');
}
When I step through this code in the IE debugger, attachEvent returns 'true' in both instances, which should indicate that the event attachment attempt was successful. However, when I look at the [Event] handlers for the control within the debugger, all the events show 'null', no handler attached.
Things I've tried/researched:
I've read several different articles on the vagaries of event attachment in IE, so I've speciously avoided any 'this' references.
I tried one version that used one of the addEvent wrapper blocks that tries to use addEventListener if available, even though I knew this would be an IE solution.
When I tried that version against FireFox, event attachment worked properly through addEventListener, but failed in IE using attachEvent (with attachEvent still returning true).
I then opted to eliminate any possible problems the wrapper might be introducing, and used attachEvent directly against the control, which leads me where I am now. The problem persists.
I would like to think I've simply overlooked something very simple, as I've hooked up events before without difficulty, but something here is throwing me a curveball I just don't recognize. Appreciate the extra eyeballs on this to see where I've erred.
Setup
I've attached an event to the 'window' object, and I would like to check that it's there via code.
window.addEventListener('beforeunload', function(e){ /*...*/ }, false)
Attempts
I've tried the simple, and jQuery, without luck. I have more attempts up on jsFiddle.
window.beforeunload //is undefined as is window.onbeforeunload
$(window).data('events') //not working either
Is this possible?
There are similar questions (here and here) about the DOM, and other elements, but none of the approaches in those that I have tried have worked.
You can use the in operator...
'onbeforeunload' in window; // true (if supported)
If supported, the property will exist, though the value will be null.