Wie kann ich "Checkboxen" machen, die ihre Anzahl bei jedem Linksklick erhöhen und bei Rechtsklick abnehmen?

Question

ich zur Zeit ein Formular mit Bild versehenen Kontrollkästchen bin mit:

<form action="submit.php" method="POST"> 
<table cellspacing="15"> 
<tr> 
<td> 
    <label for="lightning"><img src="units/lightning.png"/></label> 
    <input type="checkbox" name="lightning" id="lightning"> 
</td> 
<td> 
    <label for="delita"><img src="units/delita.png"/></label> 
    <input type="checkbox" name="delita" id="delita"> 
</td> 
<td> 

(es geht weiter nach unten für eine Weile alles nicht einfügen)

es ist eine grundlegende Checkbox, wollen aber, was ich etwas Das stapelt Zahlen, je mehr Sie klicken. Nehmen wir zum Beispiel an, ich klicke einmal auf das Kontrollkästchen mit meinem linken Klick: es wird überprüft und eine "1" wird darüber angezeigt. Wenn zwei mal, eine 2 etc ... und mit der rechten Maustaste würde diese Zahl verringert werden. Ist es in irgendeiner Form möglich?

Vielen Dank für Ihre Zeit.

Answer 1

Das ist etwas, ähnlich dem, was Sie gefragt .. wie andere sagte, Kontrollkästchen sollte nicht für diese Art von Dingen verwendet werden .. irgendwie Sie es wie ein Beispiel nehmen: (mit jQuery)

$('#myform input[type="checkbox"]').on('mousedown', function(e){ 
 
    $numberElem = $(this).parent().find('.number'); 
 
    var num = $numberElem.html(); 
 
    if(e.which == 1){ // left click 
 
     num++; 
 
    } 
 
    else if(e.which == 3){ // right click 
 
     num--; 
 
    } 
 
    $numberElem.html(num); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div id="myform"> 
 
    <div> 
 
     <input type="checkbox"> 
 
     <div class="number">0</div> 
 
    </div> 
 
    <div> 
 
     <input type="checkbox"> 
 
     <div class="number">0</div> 
 
    </div> 
 
</div>