Why document.getElementById for hidden input works in IE but not Chrome?

i have a problem with this part of js code not working in Chrome but working in IE.

this is my javascript code :

function submitformWithPage(xpage)
{

  document.getElementById('itempage').value = xpage;
 alert(xpage);
  document.searchForm.submit();

}

and this is my html code

<form name="searchForm" action="search.php" method="get">

<input  type="text" name="search" value="<?php if(isset($_GET['search'])) { echo $_GET['search']; } ?>"/>
<input type="hidden" name="parameter" value="test" />
<input id="item" type="hidden" name="itempage" value="1" />
<input type="hidden" name="pageBigForward" value="10" />
<input type=开发者_如何学C"hidden" name="pageSmallForward" value="1" />

<button style="" onclick="javascript: submitform()">Search</button>

</form>

I submitted the form by using this code and it works in IE but not in Chorme.

<button style="" onclick="javascript: submitformWithPage(3);">3</button>

I am lost on how to solve this problem.

Can anyone help me ?

Thanks in advance.

Your input has the name of itempage, not the id.

<input id="item" type="hidden" name="itempage" value="1" id="itempage"/>

Using names-as-ids is only supported in IE5-7!

Function getElementById is searching by attribute "id", not "name".

So replace itempage with item and you are good to go.

Use id instead of name:

document.getElementById('item').value = xpage;

You have set the name but not the ID of your hidden element to "itempage"

It works in IE because IE considers the "name" attribute as well as the "id" attribute for "getElementById()". It's a pretty stupid behavior, really, but it benefits your code because you don't have that string as an "id" value.