獲取同一字符串的多個索引

Question

我有這個：

<div contenteditable='true' class="my_div"> mango banana jus mango <b>orange<b/></div>

;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;; ^ 1 ;;;;;;;;;;;;;;;;;;; ^ 18

我想得到每個芒果的索引。

我嘗試過：

$('.my_div').keyup(function(){
   let mots = $(".my_div").html().replace(/(<[^>]*>)|(&[^;]*;)/gi, ' ').split(' ');
   mots = mots.filter( function(val){return val !== ''} );
   var i;
   for (i = 0; i < mots.length; ++i) {
     if (mots[i] == "mango") {
       var indexOf_ = $(".my_div").html().indexOf(mots[i]);
       console.log(indexOf_);
     }
   }
});

但是那個代碼總是給我“ 1”作為“ mango”的索引。 它應該給我1和18作為芒果的指數

我的錯誤在哪里？

謝謝。

Answer 1

請嘗試此代碼-

$('.my_div').keyup(function(){

   var searchableString = $(".my_div").html();
   var keyword = "mango";

   var index = searchableString.indexOf(keyword);
   while (index >=0){
    console.log("Index : "+index);
    index = searchableString.indexOf(keyword, index+keyword.length)   ;
   }
 });

Answer 2

您總是得到1，因為您總是從字符串的開頭開始。 indexOf方法接受稱為“ fromIndex”的第二個參數（可選），該參數指示開始搜索的索引。 因此，在下面的方法中，我跟蹤找到的芒果的最后一個索引“ lastIndexOf”，並在下一次從那里開始。

 $('.my_div').keyup(function(){ let mots = $(".my_div").html().replace(/(<[^>]*>)|(&[^;]*;)/gi, ' ').split(' '); mots = mots.filter( function(val){return val !== ''} ); var i; // Keep track of the last index var lastIndexOf = 0; for (i = 0; i < mots.length; ++i) { if (mots[i] == "mango") { // Start searching from last index +1 lastIndexOf = $(".my_div").html().indexOf(mots[i], lastIndexOf+1); console.log(lastIndexOf); } } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div contenteditable='true' class="my_div"> mango banana jus mango <b>orange<b/></div>