Question

I have the following script:

<script language=javascript>
    function process(v){
        var value = parseInt(document.getElementById('v').value);
        value+=v;
        document.getElementById('v').value = value;
    }
</script>


<input type=test size=10 id='v' name='v' value='3'>
<input type=button value='-' onclick='javascript:process(-1)'>
<a id="v" href="#" onclick='javascript:process(-1)'>minus</a>

If you click the button, it will deduct 1 from the total amount (3). The same applies for the minus-link. Now this all works great.

The problem is that I want to allow each one to deduct 1, just one time. Without disabling the button/link.

Example what I need:
So I click the button: 3 -> 2.
Now I click the button again, nothing will happen 2 stays 2.
Now I click the minus-link, 2 -> 1.
Clicking the link again, nothing will happen 1 stays 1

This can all be mixed of course. The main thing is, they each are allowed to do the -1 just one time (the first time clicked upon).

How to do this?

Kind regards,
Maurice

Answer 1

Since this question is tagged under jQuery, I provide you a way do do it in jQuery! Using this could help you in the long run to get a cleaner code and to fix future problems like this 😉

Demo: http://jsfiddle.net/NtHwN/4/

<input size=10 id="sum" value="3">
<input class="minus" type=button value="-">
<a class="minus" href="#">minus</a>

$(document).ready(function() {
    $(".minus").one("click", function(){
        var value = parseInt($("#sum").val());
        $("#sum").val(value -1);
    });
});