Error when using js in href ie 11 - javascript

I have a link:
someText
it works fine everywhere except ie(i try ie11) i have this error
This page can’t be displayed.
Make sure the web address //ieframe.dll/dnserror.htm# is correct.
How can i solve this?

If you use a javascript URI scheme in a HTML href attribute, this is different to using an onclick event handler.
In IE, the result of executing that JavaScript will replace the currently loaded document.
To avoid this (without refactoring your code to not do things this way), you can end your href with the javascript operator void, which tells your javascript to return nothing, at all (well, undefined).
Then IE will stay on the current page.
<a href="javascript:someObject.someFunction(); void 0" ...
...and you probably don't want the target="_blank" since you're telling a new window to run your JavaScript code, and your function is not available in that window.

I would do this instead:
someText
It will open a new tab as you intended, and it works in chrome, firefox and IE.

Related

HTML anchor tag's onclick attribute does not call javascript function

We have a DotNetNuke module running in an instance of DotNetNuke 5.4.4, installed on "Server A", a Windows Server 2008 R2 Standard machine with IIS 6.1 and Internet Explorer 11.
We're accessing our DotNetNuke module from "Server B", running Windows Server 2008 Standard, with Internet Explorer 9.
The issue happens when we click an anchor html element that has an onclick attribute, while accessing our module on Server B.
The anchor with the onclick is like:
<a onclick='OpenWindow("/DotNetNuke/DesktopModules/Module/View.aspx?dt=%c2%b2%c2");return false;'
href="http://000.00.0.0/DotNetNuke/DesktopModules/Module/View.aspx?dt=%c2%b2%c2"
target='_blank'
jQuery1431968126278="42">Doc name (SSN-SS-SSNN)</a>
And the OpenWindow function is like this
function OpenWindow(url) {
window.open(url, '', 'top=15,scrollbars=yes,menubar=no,height=800,width=800,resizable=yes,toolbar=no,location=no,status=no');
}
As you can see we have an anchor element, with an onclick attribute, where it is supposed to call the OpenWindow javascript function, then return false, so the default action for clicking an anchor (browse to the href) does not happen.
When we click this link though (ONLY on server B), we get no popup window, no breakpoints in the OpenWindow function are hit, and the browser navigates to the href by opening a new tab (View.aspx). This suggests to me that the OpenWindow function referenced by the onclick attribute is not even running for some reason, even though it is on the anchor element, and works on any other server.
What I've tried
I compared the security settings, web.config files, and DotNetNuke settings between the Server A DotNetNuke and my local developer DotNetNuke instances, and found no differences in setup.
I compared the Server B Internet Explorer security settings to my security settings, and found no differences in setup.
On the advice of comments on this question, I tried changing the anchor tag to a span tag instead (removed href and target attributes), and I am seeing the same behavior. It works on Server A and Dev, but doesn't do anything on Server B now. I think the core issue is that either the onclick attribute is not being recognized, or is being blocked somehow.
I've now gone further and changed most of the <a>...</a> tags into <span>...</span> tags, with specific classes, that I then attach jQuery(...).live('click', ...) handlers to (using jQuery 1.4.2). That is allowing the clicks to work, but I still haven't resolved why the onclick attribute is being ignored.
What's weird..
If I open the developer tools (IE9), then click the "Edit" button to turn edit mode on and off again, all of the onclick attributes on anchor tags and img tags start working correctly, until I reload the page.
If I edit the onclick handler in any way manually through the developer tools, like say removing the return false; from the onclick handler, it will work, but if I put the return false; back to make it like I never changed anything, it stops working again.
What I'm trying to figure out
I am hitting a wall with what to check to figure out this issue. I can't reproduce it on my developer machine, and it works on Server A as well, so the code is working perfectly fine.
I'm thinking there must be a setting that I am overlooking somewhere, but where? I have no idea what else to check at this point, and I'm looking for ideas.
I don't have an exact answer, but I can give you the general idea of what is happening and why.
The two servers are not getting identical content -- perhaps they are pointed at different CDNs, perhaps one has an old file of a JavaScript file somewhere -- you'll have to walk through them one by one.
Something, somewhere, is applying an onclick handler to all of your anchor tags.
At first I thought it was something attached to the body element and targeting your links, but I ruled that out. The fact you can edit the HTML and save it and then the link works means you are detaching whatever was attached to that link element.
I would:
Save the entire web page from Site A
Save the entire web page from Site B
Run a diff tool against the two directories.
Have you tried to call window.open directly from the onclick attribute? It could be that the function is not loaded at the time the link is clicked, so it produce an error, so return false is not called, and the link proceed with its default behaviour (in this case open a tab).
If this is the case, look at the loading order of that function, or try placing it in a different part of your code (maybe within the onload event).
Check if you're showing JS errors in your Internet Options.
It might be a bit childish, but since you are opening a window as a Pop Up there can be issue that the URL from the site might be blocked from the browser. It should work at all times if you just replace
window.open(url, '', 'top=15,scrollbars=yes,menubar=no,height=800,width=800,resizable=yes,toolbar=no,location=no,status=no');
with
window.open(url);
Have you tried modifying your tag to:
<a href='javascript:MyFunction(this);' data-url='YourUrl'>Name</a>
MyFunction: function(obj) {
var element = $(obj);
window.open(element.data("YourUrl"));
}
Note that if the user's browser is configured to open Windows as tabs, there is not a workaround. target="_blank" is the best way that I know of to achieve this and enforcing browser behavior via GP.
Sounds like it's something not in the scope of the code you have provided. You mentioned opening the IE9 dev-tools makes it work, I suggest try adding console -polyfill, something like:
if(typeof(console)=="undefined") {
var console = {
log : function() {},
error : function() {},
debug : function() {}
};
}
Just in case some of your code is outputting things into the console and the JS code stops working after that event. Could be some external library, which after loading starts outputting things to the console - that might work differently on different servers because of caching settings and/or network latency.
NOTE: to test this properly, remember to add this into a SCRIPT tag before you load any JS code or import any external library.

onclick download function is an empty string?

I am having an odd problem in my onclick handler.
I am calling a javascript function "download" in the onclick of an . This has been in use on production websites for years. Recently, I get a strange javascript error when clicking the button in Firefox or Chrome (not a problem in IE8). Firefox says "TypeError: download is not a function" and Chrome says "TypeError: string is not a function".
HTML:
<a onclick="download('position','container','ids');return false;" href="#">Run download</a>
JS:
function download(position, container, ids) {
alert('in download');
}
You can see this demonstrated in this Fiddle.
Primarily, I would like to know WHY this doesn't work (other functions work fine). It looks like if I rename the function or use a button instead of a link, the problem will be solved as well, but deploying such a change will be a nightmare. If it is necessary, that's fine, but I want to know why the download function no longer works.
It seems that, with HTML5, <a> tags support a new attribute named "download" (see this link for example), that has an empty value by default.
Your code will work if you change it to:
<a onclick="self.download('position','container','ids');return false;" href="#">Run download</a>
Indeed, events (onclick in this case) run in the scope of the element they are bound to (<a> here), so "download" means this.download if it exists.

JavaScript document write in IE8

This code below runs with jaavascript error in IE 8 browser after window.open('','','width=200,height=100') line of code gets executed. New window gets open but it runs with error "jQuery is undefined". Here I do not use jQuery at all, but sure, I use it all across the site.
var newWindow = window.open('','','width=200,height=100')
newWindow.document.write(someHmtlAsString);
newWindow.document.close();
newWindow.focus();
Does anyone have suggestion why is this so, or is there some bug in IE (hack for IE) which would eliminate javascript error while page renders?
Thanks
It looks like someHmtlAsString that you insert contains some <script> tag that tries to use jQuery. Inspect its content and if that's the case, add tag to load jQuery to it or change code not to use it.
You should set the source of new windows and iframes to about:blank if you want control over them.
You also want to use newWindow.contentDocument || newWindow.contentWindow.document
And it might be a good idea to open() the document before you write() to it.
Update: forgot this:
If you open the window about:blank, it needs time to load..
So you cannot write to it at once!!
So either check if it is loaded (onload), then have it write the source (I prefer this).
OR set timeout of about 50ms (usually) and then write to the new window/iframe.
also note that xhtml does not support document.write!!
Good luck!

How to view all JavaScript functions called in real time?

I want to figure out how a website reloads it's content using AJAX. Therefore i would like to see what JS functions are called in real time because I can't figure out what function is responsible for reloading the page dynamically. How to see all executed functions JS in real time in FF, Chrome, Opera or IE?
Maybe using the 'profile' button in the firebug console tab can give you an indication of the function(s) that are fired. Furthermore you can tell firebug's console to show xmlhttp requests (expand 'console' at the top of the firebug screen. After that, If an ajax request fires, it should be visible in the console. In the 'post' tab in such a request you may be able to infer the function triggering the request, looking at the parameters.
I think what you want is a feature in Chrome:
find the element that is being reloaded and right click,
choose inspect from context menu,
then right click the html of the element (in the bottom firebugish pane),
in the context menu there are options to:
break on subtree modifications
break on attributes modifications
break on node removal
in your case maybe set "break on subtree modifications" on the body tag would do it?
Article on awesome new dev features in chrome: http://www.elijahmanor.com/2011/08/7-chrome-tips-developers-designers-may.html
Install firebug in FF. Visit this link: http://getfirebug.com/
I would do a big search and replace on all the file using a regular expression that matches the function names (something like "function (.*)\((.*)\){") and use that to insert a console.log(functionName) at the beginning the function.
So you search for function (.*)\(.*\){ and replace it with function \1 (\2){ console.log("\1"); (Note: Regular expressions are most likely wrong as I didn't check them - you'll need some testing to get it right).
It seems a bit crazy but it should work. I've used that method to debug a Director Lingo project.
Obviously, make sure you backup the whole project before doing the replacement.
Following on the answer given in case you have access to the source code. With this regular expression you can do a console.log of all function calls:
search for:
function (.*){
replace with:
function \1 { console.log\(("\1")\);
I often using Firefox add-on JavaScript Deobfuscator
https://addons.mozilla.org/en-us/firefox/addon/javascript-deobfuscator/

Why is this 'href' value not working in Opera?

I have the following:
Test
When run in Chrome, it functions as expected and turns the page red. However, in Opera I get:
[object Object]
Closer inspection reveals that Opera thinks that javascript:Query('body')... is some kind of URL. What am I doing wrong? Doesn't Opera recognize javascript: links in the href attribute?
jsFiddle: http://jsfiddle.net/9CZZL/
Edit: seems to be a Firefox problem too...
The issue is that the return value of jQuery('body').css('backgroundColor','red') is an object, which some browsers interpret as the new content for the web page. To fix this, you can use the JavaScript void operator to turn it into undefined, which FF and Opera (and potentially others) will handle as you intended. You will notice that this issue is also described on that page, since it's the premier use-case of the void operator (other than code golf where void 0 is less characters than undefined).
Test
This should give the intended result: http://jsfiddle.net/9CZZL/13/
It should be noted that handling clicks this way is considered bad practice. Instead, using event handlers in JavaScript is recommended. This helps separate the different layers of your web app, which in turn will make debugging in the future easier.
I just did a google search and no, apparently Opera does not recognise "javascript:" href values. You would have to implement an onClick or similar solution.
Does it in Firefox too.... not quite sure why. But I never liked putting JavaScript right in the URL... you could try putting it in the onclick event or pull the whole thing out and separate it:
http://jsfiddle.net/mnbayazit/6d5An/
These all work as href values for me in Opera 10.1:
javascript:void(0)
javascript:alert("Hello")
javascript:window.location.href = 'http://www.google.com'
Your snippet does not though.
A viable work around is:
Test
Or even:
Test
...since that seems to work.

Categories

Resources