jQuery .each () इंडेक्स?

Question

मै इस्तेमाल कर रहा हूँ

$('#list option').each(function(){
//do stuff
});

एक सूची में विकल्पों पर लूप करने के लिए। मैं सोच रहा हूं कि मुझे वर्तमान लूप का सूचकांक कैसे मिल सकता है?

जैसा कि मुझे नहीं पता है कि मेरे पास var = 0 है; और लूप के अंदर i ++ है;

Answer 1

$('#list option').each(function(index){
  //do stuff
  console.log(index);
});

इंडेक्स लॉग करता है :)

एक अधिक विस्तृत उदाहरण नीचे है।

function run_each() {

  var $results = $(".results");

  $results.empty();

  $results.append("==================== START 1st each ====================");
  console.log("==================== START 1st each ====================");

  $('#my_select option').each(function(index, value) {
    $results.append("<br>");
    // log the index
    $results.append("index: " + index);
    $results.append("<br>");
    console.log("index: " + index);
    // logs the element
    // $results.append(value);  this would actually remove the element
    $results.append("<br>");
    console.log(value);
    // logs element property
    $results.append(value.innerHTML);
    $results.append("<br>");
    console.log(value.innerHTML);
    // logs element property
    $results.append(this.text);
    $results.append("<br>");
    console.log(this.text);
    // jquery
    $results.append($(this).text());
    $results.append("<br>");
    console.log($(this).text());

    // BEGIN just to see what would happen if nesting an .each within an .each
    $('p').each(function(index) {
      $results.append("==================== nested each");
      $results.append("<br>");
      $results.append("nested each index: " + index);
      $results.append("<br>");
      console.log(index);
    });
    // END just to see what would happen if nesting an .each within an .each

  });

  $results.append("<br>");
  $results.append("==================== START 2nd each ====================");
  console.log("");
  console.log("==================== START 2nd each ====================");


  $('ul li').each(function(index, value) {
    $results.append("<br>");
    // log the index
    $results.append("index: " + index);
    $results.append("<br>");
    console.log(index);
    // logs the element
    // $results.append(value); this would actually remove the element
    $results.append("<br>");
    console.log(value);
    // logs element property
    $results.append(value.innerHTML);
    $results.append("<br>");
    console.log(value.innerHTML);
    // logs element property
    $results.append(this.innerHTML);
    $results.append("<br>");
    console.log(this.innerHTML);
    // jquery
    $results.append($(this).text());
    $results.append("<br>");
    console.log($(this).text());
  });

}



$(document).on("click", ".clicker", function() {

  run_each();

});

.results {
  background: #000;
  height: 150px;
  overflow: auto;
  color: lime;
  font-family: arial;
  padding: 20px;
}

.container {
  display: flex;
}

.one,
.two,
.three {
  width: 33.3%;
}

.one {
  background: yellow;
  text-align: center;
}

.two {
  background: pink;
}

.three {
  background: darkgray;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container">

  <div class="one">
    <select id="my_select">
      <option>apple</option>
      <option>orange</option>
      <option>pear</option>
    </select>
  </div>

  <div class="two">
    <ul id="my_list">
      <li>canada</li>
      <li>america</li>
      <li>france</li>
    </ul>
  </div>

  <div class="three">
    <p>do</p>
    <p>re</p>
    <p>me</p>
  </div>

</div>

<button class="clicker">run_each()</button>


<div class="results">


</div>

Comments

और नहीं , उदाहरण के लिए, function( value | element, index | key )समकक्ष मूल विधि forEachऔर हर दूसरे लोकप्रिय एपीआई की तरह।

— बार्नी

अक्सर अलर्ट के बजाय कंसोल.लॉग के साथ डिबग करना बेहतर होता है। बड़ी विकल्प सूची आपकी विंडो स्टैक को अलर्ट के साथ बर्बाद कर देगी।

— मार्कोक्राएम

function(index | key , value | element ) क्या यह वैध है ..?

— मिस्टर वर्ल्ड

Answer 2

jQuery आपके लिए इसका ख्याल रखता है। आपके .each()कॉलबैक फ़ंक्शन का पहला तर्क लूप की वर्तमान पुनरावृत्ति का सूचकांक है। दूसरा वर्तमान डोम तत्व से मेल खाता है इसलिए:

$('#list option').each(function(index, element){
  alert("Iteration: " + index)
});

Answer 3

से jQuery.each () प्रलेखन :

.each( function(index, Element) )
    function(index, Element)A function to execute for each matched element.

तो आप उपयोग करना चाहते हैं:

$('#list option').each(function(i,e){
    //do stuff
});

... जहां सूचकांक सूचकांक होगा और सूची में तत्व विकल्प तत्व होगा

Answer 4

यह देखकर आश्चर्य हुआ कि किसी ने यह वाक्य-विन्यास नहीं दिया है।

.each डेटा या संग्रह के साथ वाक्यविन्यास

jQuery.each(collection, callback(indexInArray, valueOfElement));

या

jQuery.each( jQuery('#list option'), function(indexInArray, valueOfElement){
//your code here
}); 

Answer 5

$('#list option').each(function(intIndex){
//do stuff
});