2016-08-23 3 views
0

Ich möchte Li an eine UL mit einer Schaltfläche anhängen. Wenn dann jeder neue Listeneintrag hinzugefügt wird, wird die Anzahl der Listenpunkte angezeigt. Ich kann das Li hinzufügen, weiß aber nicht, wohin ich von dort gehe.jQuery Erkennen, wenn Listenelement hinzugefügt wird

Alle Zeiger werden sehr geschätzt.

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>List counter</title> 
</head> 
<body> 
    <ul class="myUL"> 
    </ul> 
    <button class="myBUTTON">Add List Item</button> 
    <p>List count>#</p> 

    <script src="js/jquery-1.12.1.min.js"></script> 
    <script> 
     $('button.myBUTTON').on('click', function(eval) { 
      eval.preventDefault(); 
     $('ul.myUL').append('<li>Item 1</li>'); 
     }); 
    </script> 
</body> 
</html> 

Antwort

1

Sie können nur die length verwenden, um die li Zahl zu bekommen und es in den click Zuhörern gesetzt.

$('.myBUTTON').on('click', function() { 
 
    // get the length before and directly increment by one to set it to the elements 
 
    var length = ++$('.myUL li').length; 
 

 
    $('.myUL').append('<li>Item ' + length + '</li>'); 
 
    $('p').text('List count ' + length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<ul class="myUL"></ul> 
 
<button class="myBUTTON">Add List Item</button> 
 
<p>List count 0</p>

+0

Dank Eisbehr das hilft –

+0

Sie sind willkommen, @LaurenceL! – eisbehr

Verwandte Themen