jquery rimuovi con backbone.js non funziona - javascript, jquery, backbone.js

Ho un jquery per aggiungere li a ul esistentifacendo clic su un pulsante e rimuoverlo uno ad uno facendo clic su un altro pulsante. La creazione funziona ma la cancellazione non funziona. Ho usato aggiungi e rimuovi per aggiungere ed eliminare li.

Ecco il mio codice:

$(document).ready(function(){
var ListView = Backbone.View.extend({
el: $("body"), // el attaches to existing element
events: {
"click button#add": "addItem",
"click button#remove": "removeItem"
},
initialize: function(){
_.bindAll(this, "render", "addItem","removeItem");
this.counter = 0; // total number of items added thus far
this.render();
},
render: function(){
$(this.el).append("<button id="add">Add list item</button>");
$(this.el).append("<button id="remove">Remove list item</button>");
$(this.el).append("<ul></ul>");
},
addItem: function(){
this.counter++;
$("ul", this.el).append("<li>hello world"+this.counter+"</li>");
},
removeItem: function(){
alert(this.counter);
$("li",this.el).remove("<li>hello world"+this.counter+"</li>");
}
});
var listView = new ListView();
});

risposte:

1 per risposta № 1

Puoi chiamare entrambi remove() su un elemento per rimuoverlo o assegnargli un selettore valido per rimuovere alcuni altri elementi. Quindi puoi provare anche tu

$("li:contains("hello world" + this.counter+ "")", this.el).remove()

o

$("ul", this.el).remove("li:contains("hello world" + this.counter+ "")")

Qui sto usando il :contains selettore. Nel tuo scenario puoi anche usare il :last-child selettore che lo semplifica come:

$("li:last-child", this.el).remove()

o

$("ul", this.el).remove("li:last-child")

---

1 per risposta № 2

Sembra che tu stia cercando di rimuovere l'ultimo elemento facendo clic su Rimuovi, se è così. è possibile modificare rimuovere l'elemento in

addItem: function(){
this.counter++;
$("ul", this.el).append("<li class="count-"+this.counter+"">hello world"+this.counter+"</li>");
},
removeItem: function(){
$("li.counter-"+this.counter+,this.el).remove()
}

---

0 per risposta № 3

Non è possibile rimuovere l'elemento passandogli l'intero codice HTML al metodo di rimozione, è necessario utilizzare un selettore, quindi un ID, classe, tipo o altro.

removeItem: function(e){
$("ul",this.el).remove("li:nth-child("+counter+")");
}

Ciò eliminerebbe un li dall'ul a seconda del tuo contatore. Se si desidera rimuovere un li speciale, sarà necessario modificare la configurazione, perché come può il pulsante sapere quale li rimuovere al clic.

Ad esempio, puoi impostare lo stesso pulsante di rimozione:

events: {
"click li": "removeLi"
}

e come funzione di rimozione:

removeLi: function(e){
$(e.target).remove();
}

Spero che sia d'aiuto.

---

0 per risposta № 4

O, attenendosi al tuo counter thingy:

    removeItem: function(){
alert(this.counter);

this.$("li").eq(this.counter-1).remove();
this.counter--;
}

jQuery.eq ()

---

0 per risposta № 5

La tua funzione di rimozione è difettosa. Puoi usare il selettore css "nth-child (nth)" per rimuovere l'elemento ...

removeItem: function(){
$("ul " + "li:nth-child("+this.counter+")",this.el).remove()
this.counter--;
}

---