+1 au bouton en utilisant javascript ou jquery

Je veux incrémenter une valeur de bouton sur un bouton que je devrai plus tard soumettre à ma base de données.+1 au bouton en utilisant javascript ou jquery

Je le fais actuellement comme montré ci-dessous mais lorsque je clique sur le bouton, les valeurs incrémentées s'affichent et le texte du bouton "GOAL" disparaît.

Comment puis-je faire en sorte que lorsque le bouton est cliqué il changer le nom du bouton à la valeur incrémentée au lieu de A. Emportant le nom des boutons ou B: Le fait de devoir utiliser un champ de saisie pour afficher le résultat

Je voudrais à afficher comme ceci:

GOAL then GOAL etc etc 
(1)  (2)

le code html

<button type="button" id ="button1" class="btn btn-lg btn-primary">GOAL</button>

le jquery

$('#button1').click(function() { 
    $('#button1').html(function(i, val) { return (val*1+1) }); 
});

Source

2017-03-23 Robyn

Peut-être que vous pouvez simplement ajouter un élément span dans ce button et modifier le contenu de span lorsque l'utilisateur clique sur le bouton.

html

<button type="button" id ="button1" class="btn btn-lg btn-primary"> 
GOAL<br>(<span>1</span>) 
</button>

jQuery:

$('#button1').click(function() { 
    $('#button1 span').html(function(i, val) { return (val*1+1) }); 
});

Source

2017-03-23 14:01:27 awmleer

Merci! Cela fonctionne parfaitement! – Robyn

Je ne comprends pas très bien undertand mais si vous voulez garder objectif chaîne et clique augmentation d'échelon après c'est ici une solution:

(function(){ 
    var goalStr = 'GOAL '; 
    // You can read it from the button as well 
    // var goalStr = $('#button1').text(); 
    var i = 0; 
    $('#button1').click(function() { 
    i++; 
    $(this).text(goalStr+i); 
    }); 
})();

Source

2017-03-23 13:58:24 kidwon

Oui, c'est exactement ce que je voulais dire merci! – Robyn

j'ai écrit quelque chose comme ceci:

let v; 
let firstTime = true; 
$('#button1').click(function() 
{ 
    if (firstTime) { 
     v = 1; 
     firstTime = false; 
    } else { 
     v++; 
    } 
    $(this).html(v); 
});

Source

2017-03-23 14:00:14 user218046

simplement ajouter du texte au code HTML du bouton comme celui-ci

<!DOCTYPE html> 
<html> 

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

    <body> 

    <button type="button" id ="button1" class="btn btn-lg btn-primary"><span class="btn-text">GOAL</span><div class="btn-value"></div></button> 

    <script> 
     $('#button1').click(function() { 
      $('#button1').find('.btn-value').html(function(i, val) {return (val*1+1); }); 
     }); 
    </script> 

    </body> 
</html>

Source

2017-03-23 14:08:22 alireza

Merci cela fonctionne aussi très bien. – Robyn

+1 au bouton en utilisant javascript ou jquery

Répondre

Questions connexes