简体   繁体   中英

Javascript doesn't work on Chrome and Firefox, but works on IE

I have this line of code that works on IE

Javascript:

function getInfo() {
    var date = new Date(date);
    var month = date.getMonth();
    var test = "print";
    document.getElementById('lol').value = month;
}

Body:

<input type=text name=lol>
<input type=button onClick=getInfo() value=lol>

It works on IE, but not on Chrome and Firefox. Does Chrome and Firefox has a different Javascript?

getElementById is for looking up elements by id . Your input doesn't have an id , it just has a name . Your code works on IE because (some versions of) IE are confused and return elements with name attributes from getElementById . This is a bug in IE.

To correct the problem, either add id="lol" to your input:

<input type=text name=lol id=lol>
<input type=button onClick=getInfo() value=lol>

...or use querySelector("[name=lol]") :

document.querySelector('[name=lol]').value = month;

querySelector returns the first element it can find that matches the given CSS selector. It's available on all modern browsers, and IE8.

Separately: Your code is passing undefined into the Date constructor, here:

var date = new Date(date);

...because that code is, in effect:

var date;
date = new Date(date);

...and variables start out with the value undefined .

On a browser with a standards-compliant JavaScript engine, you'll end up with an invalid date, because the specification requires that the engine convert the argument to a number and then use that as the underyling "time value" (milliseconds-since-the-epoch). Converting undefined to a number results in NaN ("not a number"); dates using NaN as their "time value" are called invalid dates. Using getMonth and similar on them returns NaN .

If you want the current date, just don't use the argument at all:

var date = new Date();

Here's a working version of your code (with minimal modifications) using an id and not passing undefined into Date :

 function getInfo() { var date = new Date(); var month = date.getMonth(); var test = "print"; document.getElementById('lol').value = month; } 
 <input type=text name=lol id=lol> <input type=button onClick=getInfo() value=lol> 

And here's one using querySelector with the name :

 function getInfo() { var date = new Date(); var month = date.getMonth(); var test = "print"; document.querySelector('[name=lol]').value = month; } 
 <input type=text name=lol> <input type=button onClick=getInfo() value=lol> 


Side note: I really would put the content of your onClick attribute in quotes, because it contains non-alphanumeric characters. According to the specification , your markup should work, and does on Chrome (the unquoted syntax allows anything but spaces, " , ' , < , > , and ` ), but...

I suggest use Jquery

<input type=text id="somethingElse">
<input type=button id="something">


$( "#something" ).click(function() {
    var currentMonth = (new Date).getMonth() + 1;
    $( "#somethingElse" ).val(currentMonth);
});

You're missing quotes and also the id :

<input type="text" id="lol" name="lol">
<input type="button" onClick="getInfo();" value="lol">

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM