Use callback
method of .load()
$("#headermenu").load("HeaderTemplate.html", function () {
$('#logout-button').focus();
//Or
//document.getElementById('logout-button').focus();
});
Pregunta
I have HeaderTemplate.html
which includes a logout button and a navigation menu. This page will be imported from different pages using jQuery like this:
$(function(){
$("#headermenu").load("HeaderTemplate.html");
});
.
.
</head>
<body>
<div id="headermenu"></div>
After login, user will be redirected to Welcome.html
which includes only Header page HeaderTemplate.html
. I wanna set focus on logout button only on this Welcome page so the javascript focus() can't be in the HeaderTemplate.html
.
The problem is, as HeaderTemplate.html is imported, javascript can't find the logout button's id no matter where I put the code in the page. I even tried like this.
<div id="headermenu"></div>
<script>
document.getElementById('logout-button').focus();
</script>
but still doesn't work. How can I make this work? Any help would be greatly appreciated. Thank you for your time.
Solución
Use callback
method of .load()
$("#headermenu").load("HeaderTemplate.html", function () {
$('#logout-button').focus();
//Or
//document.getElementById('logout-button').focus();
});