jQuery get die id/Wert von <li> - element nach Klick-Funktion

Wie kann ich alert-id die id des <li> Element geklickt? 

<ul id='myid'>
  <li id='1'>First</li>
  <li id='2'>Second</li>
  <li id='3'>Third</li>
  <li id='4'>Fourth</li>
  <li id='5'>Fifth</li>
</ul>

(Alles ersetzen kann, dass die id kann mit dem Wert oder etwas anderes, das funktioniert auch.)

InformationsquelleAutor dave | 2010-08-23
  1. 132
    $("#myid li").click(function() {
    alert(this.id); //id of clicked li by directly accessing DOMElement property
    alert($(this).attr('id')); //jQuery's .attr() method, same but more verbose
    alert($(this).html()); //gets innerHTML of clicked li
    alert($(this).text()); //gets text contents of clicked li
});

    Wenn Sie sprechen über das ersetzen der ID mit etwas:

    $("#myid li").click(function() {
    this.id = 'newId';

    //longer method using .attr()
    $(this).attr('id', 'newId');
});

    Demo hier. Und um fair zu sein, sollten Sie haben zuerst versucht, das Lesen der Dokumentation:

    InformationsquelleAutor karim79
  2. 12

    Wenn Sie Ihren html-code ein wenig - entfernen Sie die ids

    <ul id='myid'>  
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
</ul>

    Dann die jquery-code, den Sie wollen, ist...

    $("#myid li").click(function() {
    alert($(this).prevAll().length+1);
});​

    Brauchen Sie nicht, um ids, halten Sie einfach auf hinzufügen li-Elemente.

    Werfen Sie einen Blick auf demo

    Nützliche links

    • Dank Shivik, aber id ist schon definiert. Und ich bekam die Antwort, die ich suchte, in der ersten Antwort. Danke nochmal
    InformationsquelleAutor vikmalhotra
  3. 0

    können Sie den Wert des jeweiligen li, die mit dieser Methode nach Klick

    HTML:-

    <!DOCTYPE html>
<html>
<head>
    <title>show the value of li</title>
    <link rel="stylesheet"  href="pathnameofcss">
</head>
<body>

    <div id="user"></div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <ul id="pageno">
    <li value="1">1</li>
    <li value="2">2</li>
    <li value="3">3</li>
    <li value="4">4</li>
    <li value="5">5</li>
    <li value="6">6</li>
    <li value="7">7</li>
    <li value="8">8</li>
    <li value="9">9</li>
    <li value="10">10</li>

    </ul>

    <script src="pathnameofjs" type="text/javascript"></script>
</body>
</html>

    JS:-

    $("li").click(function ()
{       
var a = $(this).attr("value");

$("#user").html(a);//here the clicked value is showing in the div name user
console.log(a);//here the clicked value is showing in the console
});

    CSS:-

    ul{
display: flex;
list-style-type:none;
padding: 20px;
}

li{
padding: 20px;
}
    InformationsquelleAutor Sandeep Mukherjee
  4. -3

    Wenn Sie Mehrere li Elementen innerhalb eines li element, dann wird dies definitiv helfen Sie, und ich habe überprüft, und es funktioniert....

    <script>
$("li").on('click', function() {
          alert(this.id);
          return false;
      });
</script>
    InformationsquelleAutor RaghuVamshiKrishna Boine
Schreibe einen Kommentar