Javascript Focus lost - javascript

I have created a very simple test page below. When I open it in Internet Explorer and start tabbing through it then it tabs through all the links for the first time. However it doesn't tab through them for the second time. It just cycles through address bar, home button and current tab. It never goes to the links. It is happening because of including the javascript file snare.js but we need it on our page. Can anyone suggest any way to overcome it? I have tried several approaches but it doesn't work (copying file locally, trying to focus on links etc.).
Note - The problem is only happening in Internet Explorer.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Test Title</TITLE>
<script type='text/javascript' language='JavaScript' src='https://mpsnare.iesnare.com/snare.js'> </script>
</HEAD>
<BODY>
Test
Test2
Test3
</BODY>
</HTML>

Your javascript error i try remove script tag it woking.
hope this help!
You can trick javascript focus on link3 when blur link1 or use other trick my code i test working ok
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Send Money - Set Up Payment - U.S. Bank</TITLE>
<script type='text/javascript' language='JavaScript' src='https://mpsnare.iesnare.com/snare.js'> </script>
</HEAD>
<BODY>
<div>
<a id="link1" onBlur="this.tabIndex=1" href="http://www.google.com">Test</a>
<a id="link2" onBlur="this.tabIndex=2" href="http://www.google.com" >Test2</a>
<a id="link3" onBlur="document.getElementById('link1').focus()" href="http://www.google.com">Test3</a>
</div>
</BODY>
</HTML>

Related

Is there a way to sense if there is a # besides the .html link? (JavaScript)

I have a simple HTML file, it just displays this:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>
<body>
<p>Hello</p>
</body>
<script>
//Nothing yet
</script>
</html>
Usually when you go to an HTML file locally, its something like file:///C:/Users/Onedrive/ect/file.html.You can add #'s next to the "link" and nothing will happen. Is there a way to tell if there is a # next to the link with javascript?
If you mean if the link has an '#' sign at the end you can use:
window.location.toString().endsWith('#');

Website href links not working, how to fix it?

<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</html>
I have been trying to figure out why my href links are not working no matter what i do. The pages i am trying to connect them to are named like in the code so i am highly confused.
You're missing a body tag and then closing tags .. browsers will behave badly ;)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<body>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</body>
</html>
Please check like Home.html and other Html page that you are using for href are located at same folder where your main Html page is located.
I have created a sample.html page from above code and replaced Home.html page with my page
it is working.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</html>
I have used chrome for it.I have put all the Html page like this webapp/app/view/sample.html and others also are available at view/
<html>
<body>
<a href="mailto:cscreamery#gmail.com"></i>Email us at
cscreamery#gmail.com</a>
or
<a href="tel:(719)-555-0987"></i>call us at
(719)-555-0987</a>
</body>
</html>

Javascript file inside iFrame do not get executed when iFrame refreshes

Is there any reason why the javascript file ( app.js ) which is used inside my iframe do not get executed when my iFrame refreshes?
Basically what's happening now is:
When I first load index.html , the javascript app.js output "hello world" to the console, but then once the iframe gets automatically refreshed ( through reloader.js ) everything refreshes but the javascript, what I mean is, once the iframe is refreshed I don't get a new "hello world".
Does anyone passed through the same issue?
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>treedux - Development Server</title>
<script src="reloader.js"></script>
<script>
</script>
</head>
<body>
<div class="topbar">
<div class="icon-menu"></div>
3dux.io Header
</div>
<iframe id="treeduxwrapper" class="iframe" src="iframe.html"></iframe>
</body>
</html>
iframe.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>treedux - Development Server</title>
<script type="text/javascript" src="app.js"></script>
</head>
<body>
<div class="topbar">
<div class="icon-menu"></div>
CONTENT
</div>
</body>
</html>
app.js
console.log('hello world')
Thanks in advance,
TF
Try to reload by this,
document.getElementById('treeduxwrapper').contentWindow.location.href = "iframe.html"
I think the issue is you have kept your reloader.js in the index.html which will reload the current page(index.html) only, not the iframe.html. So in short your iframe.html is not getting reload on every reload of index.html.

How to integrate javascript code in my html?

Hi I'm very new to writing code in html and javascript and am wondering why my script tags aren't producing any output when I open my html file. I've tried console.log, document.write, alert, etc, and none of them seem to be appearing in my code. Nevermind the content of the code, its not at all important.
picture of my code
Dont use write but alert
<!DOCTYPE HTML>
<html>
<head>
<title>Everything Potatoes</title>
<meta charset="utf-8" />
</head>
<body>
<h1>Heelo Moto</h1>
<script>
alert("Hello mojo");
</script>
</body>
</html>

How to make collapsible menus jQuery Mobile

I'm really new at this and I would like to create collapsible menus using jQuery Mobile. I went over to their site and found this resource:
http://demos.jquerymobile.com/1.4.0/collapsible/
So, I made a test page:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="scripts/jquery-1.11.3.js"></script>
<script src="scripts/jquery.mobile-1.4.0.min.js"></script>
</head>
<body>
<div id="div2014" data-role="collapsible">
<h3>2014</h3>
<p>
Q1<br/>
Q2<br/>
Q3<br/>
Q4
</p>
</div>
</body>
</html>
but I can't seem to get it to work. All that gets displayed is this:
Please help! I'm really new at this, so I'm not sure if I'm doing things right :(
You need to include the jquery.mobile CSS file as well.
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
make use of jQuery's slideToggle() function on click.
See this pen and click 2014, the menu will be displayed and collapsed on clicking it again

Categories