Search code examples
javascriptnumberstextarea

Onclick get number of clicked word inside textarea


Is it possible to get the number of each word of string inside textarea. Like, 'I like Apple' string inside textarea, when I click on 'I' it should give 0, and 'like' ->1 and 'Apple' -> 2. Not letter wise, word wise.

<textarea>I like Apple</textarea>

Solution

  • You can find the word number/index according to the string by this also:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
    </script>
    <input type="text" id="checktext" value="This is the string to check words index" />
    

    JS code:

    $(document).ready(function() {
          $("#checktext").on('click', function(e) {
            var text = document.getElementById("checktext").value,
              element = $("#checktext")[0],
              arr1 = text.split(" "),
              length = 0,
              selectIndex = element.selectionStart;
            if (selectIndex == 0){
              console.log(arr1.indexOf(arr1[0]));
            }
            else {
              for (var i = 0; i < arr1.length; i++) {            
                length = length + arr1[i].length + 1;
                if (length == selectIndex) {
                  console.log(i + 1);
                  break;
                }
              }
            }
          });
        });
    

    Hope this solved your issue!