JQuery problem in Internet Explorer 8

Question

The following code works fine in Firefox, but not in IE. I have tried various tweaks to both header and script call string, however nothing will make IE run the scripts. Also all security is turned off in IE.

Is there anything wrong in the following code?

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Smartube</title>
    <link href="css/default.css" rel="stylesheet" type="text/css" />
    <script src="jquery.js" type="text/javascript"></script>
    <script src="tubeutil.js" type="text/javascript"></script>
    <script src="init.js" type="text/javascript"></script>
    <script type="text/javascript">
    function formfocus() {
    document.getElementById('1').focus();
    }
    window.onload = formfocus;
    </script>
    </head>

    <body>



<div class="wrapper">
    <img class="displayed" src="gfx/sb.png">
    <form class="blocks" action="" method="get">
        <p><input type="text"  class="search" id="1" /></p>
        <p><input type="Submit" class="btn" value="" /></p>
        <ul class="reset autocomplete"></ul>
    </form>

    <ul class="reset videos"></ul>

</div>
    </body>
    </html>

n00dle · Answer 1 · 2011-09-13T09:51:30.890

Your code isn't really jQuery, it's straight javascript, but your problem here is that the W3C standard requires an ID to begin with a letter (see http://www.w3schools.com/tags/att_standard_id.asp).

You could write your script as jQuery like so:

function formfocus( ) {
    $('#myid').focus( );
}
$(window).load( formfocus );

EDIT: OK, I've just tested the following in IE:

HTML:

<div class="wrapper">
 <img class="displayed" src="gfx/sb.png">
    <form class="blocks" action="" method="get">
        <p><input type="text"  class="search" id="my1" value="" /></p>
        <p><input type="Submit" class="btn" value="" /></p>
        <ul class="reset autocomplete"></ul>
    </form>

    <ul class="reset videos"></ul>

</div>

JS:

$(document).ready( function ( ) {
  $('#my1').focus( );
});

That works in IE9, so I think it should work in 8 too. Test version is here: http://jsbin.com/ipezey/edit#javascript,html

Also, as per thirtydot's answer, This test version has an HTML 5 doctype, whereas your version has none. This could be the root of your problem.

+1. To add to that, in jQuery you don't need for the whole window `load` event, you can start manipulating the DOM on document `ready` event. :) — Shef, Sep 13 '11 at 08:52
Very true, I thought I'd write this as a strict jQuery translation of his code, but yes, I would normally just use `$(function( ) {` ... — n00dle, Sep 13 '11 at 08:54

score 1 · Answer 2 · answered Sep 13 '11 at 09:49

Is there anything wrong in the following code?

One thing strikes me as wrong, but there's no way I can know if it's the cause of your problems (I can't see the rest of your JavaScript).

You're missing a valid doctype, so Internet Explorer is in Quirks Mode, which is very bad!

Add this as the very first line:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

score 0 · Answer 3 · edited May 23 '17 at 12:19

as you can read on this question

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

so "1" is not a valid id. change that id to "id1" or "searchfield" to make the script work in all browsers.

as a sidenote: as others said, you aren't actually using jqery here, but this isn't the problem.

score 0 · Answer 4 · edited May 23 '17 at 12:29

0

First: id="1" is not a valid ID.

Second: Since you're using jQuery, I'd suggest that you use jQuery (!):

$(function(){
  $('#that-form-element').focus();
});

That will run $('#that-form-element').focus(); once the page (DOM) is ready.

edited May 23 '17 at 12:29

Community

1
1

answered Sep 13 '11 at 08:51

Znarkus

21,120
20
71
104

score 0 · Answer 5 · answered Sep 13 '11 at 09:08

id Specifies a unique id for an element within an HTML Document.

Naming rules:

Must begin with a letter A-Z or a-z
Can be followed by: letters (A-Za-z), digits (0-9), hyphens ("-"), underscores ("_"), colons (":"), and periods (".")
Values are case-sensitive

score -1 · Answer 6 · answered Sep 13 '11 at 08:49

-1

You are not using jquery at all.

use this notation :

$(function() {
    $('#1').focus();
});

instead of all your javascript

answered Sep 13 '11 at 08:49

Thomas

1,400
9
24

1

this won't solve the problem, "1" simply isn't a valid id according to the standards. – oezi Sep 13 '11 at 08:53

JQuery problem in Internet Explorer 8

6 Answers6