3
votes

Comment ajouter une classe à un élément ajouté à l'aide de Jquery?

Comment ajouter la classe 'list-group-item' tout en ajoutant un élément avec jquery?

Après avoir ajouté un

à la , la propriété de classe ne fonctionne pas comme prévu.

  $("#todoList").append($('<li>', {
    text: $('#todoInput').val(),

    class: $('list-group-item') // this is not working
  }));

javascript jquery

2 commentaires

Remplacez class: $ ('list-group-item') par class: 'list-group-item' . Utiliser $ () est un sélecteur.

nous devrions passer le nom de la classe comme class: 'list-group-item' . $ () renverra l'objet jQuery.

3 Réponses :

0
votes

Lorsque vous faites class: $ ('list-group-item') , vous créez essentiellement un objet que vous ajoutez à la classe . Vous voulez juste une chaîne qui est le nom de la classe, et non un objet. Tout ce dont vous avez besoin est class: 'list-group-item' .

$("#todoAddBtn").on("click", function() {
  $("#todoList").append($('<li>', {
    text: $('#todoInput').val(),
    class: 'list-group-item'
  }));
});

0 commentaires

1
votes

Vous pouvez faire:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul id="todoList"></ul>
<input id="todoInput">
<button id="todoAddBtn">Add</button>

.list-group-item {
  color: blue;
}

$("#todoAddBtn").on("click", function() {
  $("#todoList").append($('<li>', {
    text: $('#todoInput').val(),
    class: 'list-group-item' // <-- Class name should be an string
  }));
  $('#todoInput').val(''); // Clear input..
});

0 commentaires

0
votes

Si vous souhaitez ajouter cet 'élément de groupe de liste', changez-le en

class: 'list-group-item'

0 commentaires