0
votes

Récupérer des attributs de titre à partir de plusieurs boutons

J'ai un site avec beaucoup de boutons. Chacun d'entre eux a un attribut de titre. Je voudrais insérer le texte de l'attribut de titre dans le texte du bouton sous forme de ligne sous le texte du bouton, comme une légende.

voir ci-dessous pour un exemple de mes boutons. P>

var title = $( "button" ).attr( "title" );
$( "div" ).text( title );


0 commentaires

3 Réponses :


0
votes

Utilisez chaque code> à itérer sur chaque .btn code>. Par exemple, si vous souhaitez ajouter le texte du titre sur le bouton existant:

p>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn" title="Title Text 1">Button Text 1</button>
<button class="btn" title="Title Text 2">Button Text 2</button>
<button class="btn" title="Title Text 3">Button Text 3</button>


4 commentaires

Op veut ajouter le titre au texte du bouton, pas au document


Merci-- Comment inséreriez-vous le texte du titre dans le bouton réel, ci-dessous / après le texte du bouton?


@JeremyGrab Votre code actuel montre que vous essayez d'insérer du texte dans un DIV: $ ("div") .text (titre); ce que div est-ce? Si c'est ce que vous voulez, tout ce que vous avez à faire est de sélectionner la DIV appropriée et de définir son texte.


Je prévoyais de mettre des balises

(peut-être avec un identifiant spécifique) dans le texte du bouton pour afficher le titre. Je n'ai pas eu trop loin.



0
votes

Vous n'avez certainement pas besoin de jQuery pour cela. En fait, vous n'avez même pas besoin de JavaScript

p>

<button class="btn" title="Title Text 1">Button Text 1</button>
<button class="btn" title="Title Text 2">Button Text 2</button>
<button class="btn" title="Title Text 3">Button Text 3</button>


2 commentaires

C'est ce que je cherchais. Merci.


@Jeremygrab que j'ai ajouté un autre exemple de la façon dont vous pouvez le faire purement avec CSS (pas de JS / JQuery requis du tout)



-1
votes

Est-ce ce que vous recherchez?

p>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="group">
  <button class="btn" title="Title Text 1">Button 1</button>
  <span class="title"></span>
</div>
<div class="group">
  <button class="btn" title="Title Text 2">Button 2</button>
  <span class="title"></span>
</div>
<div class="group">
  <button class="btn" title="Title Text 3">Button 3</button>
  <span class="title"></span>
</div>


2 commentaires

C'est une alternative intéressante. Je vous en suis reconnaissant.


Pas de problème @jeremygrab. Curieux de savoir pourquoi je me suis bien fait voté ..