Develop Reference

jQuery document ready not working properly on IE

I am using jQuery .ready function to add some ajax calls on text input to my registration page's TextBoxes.
It's all working fine on Chrome, Firefox and Safari, but won't work on Internet Explorer (I'm using IE11).
This is the code I'm using on $(document).ready():
$(document).ready(function () {
$(reg_user).on('input', function (e) { ValidateEmailPass(reg_user); });
$(reg_pass).on('input', function (e) { ValidateEmailPass(reg_pass); });
$(reg_email).on('input', function (e) { ValidateEmailPass(reg_email); });
$(reg_age).on('input', function (e) { ValidateEmailPass(reg_age); });
});
It fires the validation function every time the text changes in them. Although, I IE, it tells me reg_user is undefined which causes an error and it won't trigger these functions.
I'm using jQuery 1.11.3 which supports old versions.
If you know how to fix it, please tell me. I don't know what's really causing this problem. I think IE acts otherwise with $(document).ready().

Replace
$(reg_user)
with right element(s) selector (ID or Class). You can't create link (var reg_user) to DOM element before DOM will ready.
P.S. Also IE11 has some problems with input event.

Here's a good read.
The oninput event is supported in Internet Explorer from version 9. If
you need an event that fires when the contents of these elements are
modified in Internet Explorer before version 9, use the
onpropertychange event.
So instead, you could use change - which as the comments suggest doesn't do exactly the same, but it is cross-browser compatible. Also, you should use valid selectors instead of a global variable. This is simply bad practice and I don't know how this behaves on all browsers.

.bind() .live() not working in Safari or Chrome, but works in Firefox

I am very new to this. Can someone help point me in the right direction?
I've got my website mostly working the way I want in Firefox, but now that I try test it in Safari or Chrome, it doesn't work. I'm sure there will be many more problems later, but the first issue is that I am dealing with is my main nav buttons are not working. The click handlers and mouseleave and mouseenter are not working.
Is there something wrong with this code or could it be a problem somewhere else?
function onLoad () {
var $list= $('#mainNavList');
showMainMenu(); //make menus appear
specifyScrollingElement('#mainNavList');
specifyScrollingElement('#lowerNav');
$list.find('.linkInactive').live('click', onMainNavMenuClick);
$('.albumLink').parent().bind('mouseenter',function(){
$(this).css({'background-color': '#fff'});
});
$('.albumLink').parent().bind('mouseleave',function(){
if ($(this).hasClass('current')==false){
$(this).css({'background-color': 'rgba(233,229,194,.9)'});
};
});
$('.textLink').parent().bind('mouseenter',function(){
$(this).css({'background-color': 'rgba(65,65,65,.8)'});
});
$('.textLink').parent().bind('mouseleave',function(){
if (portfoliosActive ==false && $(this).children().hasClass('portfolioButton')==true ){
$(this).css({'background-color': 'transparent'});
};
if (portfoliosActive ==true && $(this).children().hasClass('homeButton')==true){
$(this).css({'background-color': 'transparent'});
};
});
$list.find('.linkActive').live('click',function(){
var $this = $(this);
$this.addClass('linkInactive').removeClass('linkActive');
hideThumbs($list);
});
thumbnailActions('#mainNavList');
thumbnailActions('#lowerNav');
initUpperNavActions();
}

Use 'on' instead of 'bind' and 'live'... that should save you a world of pain later.
Those methods are deprecated as of jquery 1.7..
See the follow link for more info: http://api.jquery.com/bind/
As of jQuery 1.7, the .on() method is the preferred method for attaching
event handlers to a document. For earlier versions, the .bind() method is
used for attaching an event handler directly to elements. Handlers are
attached to the currently selected elements in the jQuery object, so those
elements must exist at the point the call to .bind() occurs. For more flexible
event binding, see the discussion of event delegation in .on() or .delegate().
and also: http://api.jquery.com/live/
As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach
event handlers. Users of older versions of jQuery should use .delegate()
in preference to .live().
And example of using 'on' for your code would be:
$('.albumLink').parent().on('mouseenter',function(){
$(this).css({'background-color': '#fff'});
});

You should use .on() it binds and persists. I use it in chrome with no issues.
$(".albumLink").on('click', function () {
$(this).css({'background-color': 'rgba(65,65,65,.8)'});
});
http://api.jquery.com/on/
if you are using an older jQuery you might have to use delegate()
http://api.jquery.com/delegate/
** NOTE: delegate switches the parameter order. In later Jquery (1.7) .delegate() is just an alias for .on() anyway
hth

I wasn't able to get on or delegate to work. I think I am still confused about how to use jquery.
But I figured out what the problem was with my click and mouseenter and mouseleave not working. I discovered an extra "</div>" in the code so I think there was an invisible div blocking my nav buttons. After I deleted it, the buttons all suddenly work in Safari and Chrome! Thanks for your time!

jquery live method to bind keydown event does not work in IE9 and IE10

I have following code to capture keydown event. This works fine in all browsers GC,FF,IE8 except IE9 and IE10.
$(_inputSelector, $('td', 'table')).live("keydown", function (event) {
// some client side logic
});
the selector is returning me dom elements properly but its just the event which is not trigger once the code is executed. please advise. thanks

jQuery click event not working IE7 and IE8

The following code in IE7 or IE8 doesn't work. Is this a bug? It works fine in IE6 (Incredible!)
http://jsfiddle.net/zgSmT/

Try using the live event, or binding the event after document load:
$('#clickme').live('click', function(){
alert('hey');
});
Also, you're still loading scripts.js, which doesn't exist, in your fiddle example - that might also cause a problem.

You might try
$().ready(function ()
{
$('#clickme').live('click', function(){
alert('hey');
});
}
To ensure everything is loaded.

Mootools doesn't fire the "onChange" event for Selects in IE7

I'm working with MooTools 1.2.4 and I have a select with an event "change" that works fine in Firefox but when I try to test it in Internet Explorer 7 it gives me an error saying that the select doesn't have that property or method:
my code is as simple as:
$('zone').addEvent("change",function(E) {
alert("change");
});
I've tested this code in https://www.jsfiddle.net and it does work in IE7!!! So what am I missing here? do you think that has something to do with my version of MooTools? on the MooTools more?

Seems like you've created a custom version of mootools-core and forgot to include Element.Event in the build - http://mootools.net/core