div onclick not firing in IE 8 and Chrome - javascript

I have the following javascript function in my application which is expected to perform grid filtering based on the div click, but the major problem i am facing is that the div click is working fine in mozilla firefox , but not in IE 8 and chrome, can anyone help to figure the issue related to this function
$(function(){
$('#FileDiv').live('click', function (e) {
alert(1);
});
});

Need the HTML to verify, but here's where I've run into trouble with this:
Make sure a div with id="FileDiv" is actually there. I see you're using ASP.NET and I have spent time debugging client-side code affecting content that was not delivered becuase of server-side logic. Real forehead-smacking stuff.
Try other events. Instead of live, try straight-click to see if that matters.
Make sure your function is being called on document-load. I suspect it isn't.

Related

javascript detect ios7 ipad

following the code from this question, I'm trying to add a class to html for handling iPad landscape layout issues.
But the JS to detect iPad iOS7 doesn't seem to work anymore:
if (navigator.userAgent.match(/iPad;.*CPU.*OS 7_\d/i)) {
$('html').addClass('ipad ios7');
}
I tried it on an iPad4 iOS7.
Can anyone confirm that the detection code is working for them?
EDIT: thanks to Waki's test page, we can be sure it is working.
And going through my 800 lines of app code again thoroughly, I found that I called my function that includes the code for the check from within document.ready but the function itself was placed outside of document.ready and therefore was not called. Really stupid mistake. I apologize to all who wasted their time on reading this.
are included jQuery library for use $('html') ? Because this regex is working.

jQuery Ajax-load replaces page instead of div in IE9 (without developer tool mode-switching)

I'm working on a website where one of the pages has a list of articles and an option to filter these based on certain keywords. All the keywords are links and listed to the right of the list. In order to get the correct URL's, the links on each keywords hold part of the ajaxURL that would give the correct response for the given keyword. In addition, I got a script that adds a 'click'-event to all links and appends the last required parameters to the ajaxURL. I "reload" the list by using jQuery's 'load'-function, like this:
$('a.keyword').click(function(event){
event.preventDefault();
// Other logic
$('.list').load(ajaxURL);
}
However, when using the filter in IE9 the content of 'ajaxURL' is loaded into the entire page. That is, the entire page is replaced with the resulting list. I figured this could be a problem of only using 'event.preventDefault()' on the 'click'-event I got on each link, so I added a variety of alternatives:
event.stopPropagtion()
return false
if(event.preventDefault){
event.preventDefault();
} else {
event.returnValue = false;
}
After hours of debugging, trying different combinations of these and trying IE7, IE8 and IE9 using the developer tool provided in IE, I realized that the first time I open the page with IE9 (without opening the developer tool), I get the problem described above. However, when I open the developer tool and selects IE8 it all works perfectly! The same happens when I change it back to IE9! (In this case I used all the alternatives above.)
For some reason, these transitions make it work! I can't figure out how to fix this.. I can't force users to open developer tool and switch mode to make i work. :P Any ideas? Does the developer tool add something that could do this?
I appreciate any help on the matter! :-)
PS. It works just fine in Chrome, ++.
The only thing I can think of is having console.log() in your script. That statement throws a Javascript error in IE up until you open the Developer Tools.
If that occurs earlier than the code you provided in the question then the rest of your script probably won't get evaluated, and your event handlers won't be bound at all, causing the links to just be regular links.

How can I debug JS code added into DOM by an AJAX call?

I have a webpage which loads properly formatted html forms using AJAX calls. This HTML also loads javascript code along with it and it is not working. As I am using jQuery I tried to add live() but it didn't help me. Now I need to debug this. How can I set breakpoints or watch on this code using firebug? I am using jQuery1.3 and can not deviate from it.
TIA
I'm uncertain from reading your question as to whether or not you have access to and can modify the dynamically loaded script, but if you do, add this statement:
debugger;
where you want your breakpoint.
Also note that although Firebug is perfectly capable of displaying dynamically loaded scripts, I think it hides them by default.
Also, if you have the option of using Chrome or Safari, you can just throw an exception from the point where you want to break, then set the Chrome or Safari debugger option to break on any exception. For example:
try {
throw new Error("");
}
catch () {}

oninput/onkeyup/onkeydow/onpropertychange doesn't work in IE8

As you might have noticed from the title I'm trying to make an event work properly and IE is giving me a hard time. I have tried all possible combinations, none of them seems to work.
I'm trying to mimic the Google suggestions list. A visitor should be able to come down in the list using the arrow keys, which is a Jquery keydown event. This event however also renders the request for the suggestion list at the same time in IE8 so the therefore the arrow keys function comes to an end (because of the request that is being maid.)
I know there must be a simple solution to this, but I can't see it.Help is appreciated. This is a demo: at jsbin
It works in all browsers but not in IE.
You are attaching the events before the elements exist.
Always work with elements only inside $(document).ready() method to be sure they exist and loaded in the document.
In your specific case, just move all the code:
el("inp").oninput=function(){
addScript("http://www.google.nl/complete/search?callback=suggest&q="+this.value);
}
$('#inp').keydown(
function (e){
var curr = $('#test').find('.current');
//......
}
//.....
To be inside the $(document).ready( you already have.
Live test case that works for me in IE as well: http://jsfiddle.net/n7qAD/12/
(Your original code really didn't work in IE)

document.getElementById("iframe_id").onload does not work in IE

I'm using the hidden iframe method for file upload and it does not work properly in IE. The problem is that the function to be called after the server response is not called in IE.
The line is
document.getElementById("iframe_id").onload = uploadDone;
I also tried window.iframe_id.onload, document.iframe_id.onload, etc
I don't think that there is any other error in code as this works fine in FF and Chrome.
I tried an alert instead of the function name (uploadDone) and it works (though shows an error in the script debugger). But replacing the complete function, like:
...onload = function () {...};
there works neither.
Can somebody help me make this work in IE?
Thanks in advance.
I would highly recommend you look into using JQuery or another javascript framework. It will save you a lot of pain....
You can
window.onload = Startup
in the frame document and from there call whatever function you want in the parent document.
I can look for some code if you want...

Categories