javascript - What's the difference between <input type="hidden"> and global JS variable

admin管理员组

文章数量:1345016

In our codebase we have both of them and I don't understand when to use which...

In case of <input type="hidden" id="someFlag" /> we write/read value in the following way $("#someFlag").val('1'); and $("#someFlag").val() == '1'

Why not just simply add global variable into the JavaScript file?

var someFlag2;
...
someFlag2 = '1';
someFlag2 == '1'

Are there some differences between these approaches?

In our codebase we have both of them and I don't understand when to use which...

In case of <input type="hidden" id="someFlag" /> we write/read value in the following way $("#someFlag").val('1'); and $("#someFlag").val() == '1'

Why not just simply add global variable into the JavaScript file?

var someFlag2;
...
someFlag2 = '1';
someFlag2 == '1'

Are there some differences between these approaches?

• javascript
• jquery
• html

Share Improve this question Follow asked May 29, 2015 at 7:44 user3719454user3719454 1,01611 gold badge1212 silver badges2727 bronze badges 4

• 1 Hidden inputs are useful for processing data in a form, not just holding hidden information. If you send a form, all the input variables - hidden or not - will be sent – Ben Commented May 29, 2015 at 7:48
• 1 @BenPearlKahan - Only those with a name attribute will be sent. – techfoobar Commented May 29, 2015 at 7:48
• You send some information via hidden input. – Radonirina Maminiaina Commented May 29, 2015 at 7:49
• We don't use forms, just $.ajax()... – user3719454 Commented May 29, 2015 at 7:49

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 6

As you are using AJAX request I want to guide you, You should avoid both approaches if possible First, Global variables why you should avoid global variable is mentioned in below reason...

The reason why global variables are discouraged in javascript is because, in javascript all code share a single global namespace, also javascript has implied global variables ie. variables which are not explicitly declared in local scope are automatically added to global namespace. Relying too much on global variables can result in collisions between various scripts on the same page

To know how to avoid global variables, this will be helpful -> How to avoid global variables in JavaScript?

Sameway hiddenfields adds extra fields on dom and getting values from DOM elements in heavy process, and similarly you will get values only in text formats, so you always need to convert it to interger or objects from JSON, which again will be overhead

I would prefer to save it in some closures where it is necessary, If you want to know how you can apply this in your current scenario we can talk here in ments.. For information on closure you can have a look at this stackoverflow question

See type="hidden" input is a better choice if you want to post some important values to server, which you do not want to show to the user. Typically people use it when working with forms without ajax, And if you are working with forms then you have to give an attribute name="" to it because this is the attribute which is send to the server as a key.

While global variables in js is useful in someway but i guess it is not remended because it makes the code a bit unmaintainable.

One difference in my thoughts is.

While posting a form you will be able to get the value of hidden fields as part of request variable how ever in case of global javascript variable you need to send it explicitly in the POST or GET call.

If you need variable only for client side than you can use any of them but if you need send them with server call in that case input type="hidden" would be a good choice

Hidden fields can be useful for data structure consistency.

Sending 4 "real" form fields plus two hidden fields is more easily prehensible than sending 4 real fields plus two globals, even if you're 100% AJAX.

本文标签： javascriptWhat39s the difference between ltinput typequothiddenquotgt and global JS variableStack Overflow