Disable button using GetElementsByClassName

JavaScript
1 
<!DOCTYPE html>
<html>
<head>
    <title></title>

    <script type="text/javascript">

    function disable() {
        x=document.getElementByClassName("edit");
        x.disabled=true;
 
        setTimeout(enable, 5000);
     
    }

    function enable() {
        x.disabled=false;

    }

</script>


</head>
<body>

<input type="submit" class="edit" value="edit" onclick="disable()" />

</body>
</html>

That code works, if i use id instead of classname, how to use ClassName instead?

And how to save the disable status in html5 local storage?

Something like

localStorage.setItem('x', new Date().getTime());
2

document.getElementsByClassName with an ‘s’ is what you’re after. You could also use document.querySelector('.edit');

var x = document.getElementsByClassName("edit")[0];

Yes, localStorage can be used to save a state like disabled = true across page refreshes.

localStorage.setItem('disabled', true);
localStorage.getItem('disabled');
1 Like
3

thank you so much, where to put localstorage? outside of disable function?

4

No problemo.

You’ll want to set the value whenever that state changes, in the disable / enable functions.

You’ll want to get that value when you load the page and update accordingly.

5

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.