J'essaie d'obtenir la valeur de la balise HTML. Pas le texte lui-même, mais la valeur de l'attribut. Qu'est-ce que je fais mal?

$('label').click(function() {
    $('p').text(($(this).val()));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label value="hello">click</label>
<p></p>
0
user3325783 9 août 2016 à 17:02

4 réponses

Meilleure réponse

Utilisez data-* qu'il vous permet d'utiliser toute chaîne arbitraire. ex. data-value="hello". Ceci est valable et universel sur tout élément AFAIK. La méthode jQuery à utiliser est .data()

$('label').click(function() {
    $('p').text($(this).data('value'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label data-value="hello">click</label>
<p></p>
2
zer00ne 9 août 2016 à 14:17
$('label').click(function() {
    var value = $(this).attr('value');
});

De plus, je ne pense pas que value soit un attribut valide sur un élément label.

Sans jQuery ...

Array.from(document.querySelectorAll('label')).forEach((label) => {
   label.addEventListener('click', () => {
      let value = label.getAttribute('value');
   });
});
0
alex 9 août 2016 à 14:05

Vous pouvez faire cela en JS pur;

var lab = document.getElementsByTagName("label")[0],
    pel = document.getElementsByTagName("p")[0];
lab.onclick = e => pel.textContent = e.currentTarget.getAttribute("value");
<label value="hello">click</label>
<p></p>
0
Redu 9 août 2016 à 14:11

labels n'ont pas values, input et d'autres éléments form peuvent avoir des valeurs. Donc dans votre cas, c'est la fonction attr de jQuery, pour recevoir les valeurs d'attribut. Et il n'y a pas besoin de supports supplémentaires autour de ce getter.

$('label').click(function() {
    $('p').text($(this).attr("value"));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label value="hello">click</label>
<p></p>
3
alex 9 août 2016 à 14:08