Is there any reason why I shouldn't do something like the following (to avoid using a hidden field to store the temporary information)? I'm using jQuery syntax for brevity but it's a general JavaScript question.

function editComments() {
    window.currentComments = $('#mentsTextBox').val();
    $('#mentsTextBox').removeAttr("readonly");
}

function cancelEditComments() {
    $('#mentsTextBox').val(window.currentComments);
    $('#mentsTextBox').attr("readonly", "readonly");
}

I know that globals are generally considered bad practice, but is there really any problem with doing the above?

Please don't answer/ment with "globals variables are evil" unless you can give a reason/explanation.

Is there any reason why I shouldn't do something like the following (to avoid using a hidden field to store the temporary information)? I'm using jQuery syntax for brevity but it's a general JavaScript question.

function editComments() {
    window.currentComments = $('#mentsTextBox').val();
    $('#mentsTextBox').removeAttr("readonly");
}

function cancelEditComments() {
    $('#mentsTextBox').val(window.currentComments);
    $('#mentsTextBox').attr("readonly", "readonly");
}

I know that globals are generally considered bad practice, but is there really any problem with doing the above?

Please don't answer/ment with "globals variables are evil" unless you can give a reason/explanation.

• javascript
• jquery
• global-variables

Share Improve this question Follow edited Nov 15, 2015 at 21:58 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Jul 5, 2010 at 15:17 fearofawhackplanetfearofawhackplanet 53.5k5555 gold badges165165 silver badges257257 bronze badges 2

• The "removeAttr" function only pays attention to the first argument. – Pointy Commented Jul 5, 2010 at 15:35
• yeah that was a typo. Corrected now. – fearofawhackplanet Commented Jul 5, 2010 at 15:48

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

There's no real problem with this except that global variables are evil. ;)

However, if you are using jQuery anyway, in my opinion, a much nicer way is to store it in the element using data():

function editComments() {
    $('#mentsTextBox').data("oldValue", $('#mentsTextBox').val());
    $('#mentsTextBox').removeAttr("readonly", "readonly");
}

function cancelEditComments() {
var oldValue = $('#mentsTextBox').data("oldValue");
$('#mentsTextBox').val(oldValue );
$('#mentsTextBox').attr("readonly", "readonly");
}

As long as you keep it inside the script, and nothing else gets done with the element, that should work fine.

The problem with globals in javascript (on top of that of any other languages). Is that there is no mechanism to resolve name clashes (or rather, the mechanism is to just assume that it's the same variable). If you use a global variable called currentComments and also include some other module with a currentComments global variable then one of them is going to lose, and you may get unpredictable results.

It would be better to use one that is scoped to your module, thus:

(function(){
    var currentComments;

    function editComments() {
        currentComments = $('#mentsTextBox').val();
        $('#mentsTextBox').removeAttr("readonly", "readonly");
    }

    function cancelEditComments() {
        $('#mentsTextBox').val(currentComments);
        $('#mentsTextBox').attr("readonly", "readonly");
    }
}());

There's no real reason not to do it, if you ignore the "global variables are bad" argument.

One thing you need to be aware of is you can't .delete properties from the window object in IE, it causes an exception to be thrown. In your case, since it's just a string, it probably doesn't matter.

This fails on IE:

window.foo = 'bar';
delete window.foo;