Как извлечь строку из текстового файла в JavaScript

Question

Я занимаюсь разработкой веб-портала для ASR (Автоматическое распознавание речи). Как вы все знаете, ASR не даст 100% правильный результат. Основной причиной получения неправильного результата являются речевое поведение человека, шум, стиль речи, интенсивность голоса, гомофоны (покупка, прощание, сайт, сайт) и т. Д. Я планирую провести постобработку с помощью веб-портала. Я определил текстовую область, где я получаю распознанный текст. Если пользователь обнаружил это неправильное слово в текстовой области, он дважды щелкнет по неправильному слову в текстовой области и после выбора слова в том же месте отобразит аналогичный вариант произношения слов (Подобные слова произношения хранятся в текстовом файле. Одна строка содержит одинаковые слова произношения) exa. Если пользователь выбрал слово «грустно», то в опции он получит «грустный, безумный, плохой» и т. Д. Я создал текстовый файл, который содержит следующие строки

sad, mad, bad

hero, zero

site, cite

buy,bye

Если пользователь выберет слово «сайт», то он будетполучить "site, cite" в textarea и, наконец, пользователь выберет правильное словоКосвенно я ищу слово в текстовом файле, и если слово найдено в текстовом файле, скопируйте всю строку и отобразите в качестве параметра в textarea (например, параметры поиска в Google Display после ввода текста)

Я написал небольшой код, но получить ошибку не удалосьсделать все функциональные возможности. Мой текстовый файл хранится локально.

    <textarea name="text" id="textdata" rows="7" cols="79" wrap="soft" maxlength="4000" style="overflow:auto; resize:none; font-size: 17pt; font-family:"Times New Roman"
     onselect="populateList(this.value)" > </textarea>


    <script>
     function populateList(val)
    {
        // alert("Entered populateList ");
        var textComponent = document.getElementById('textdata');
        var selectedText;
        var startPos = textComponent.selectionStart;
        var endPos = textComponent.selectionEnd;
            selectedText = textComponent.value.substring(startPos, endPos);
        alert("Selected word : "+selectedText);   
        dic(selectedText);
    }
    </script>

    <script>

    $.get("http://localhost/english/master.txt",function(returnedData) {
        $("#element").text(returnedData);
    },"text/plain");

    </script>

    <script>

    var text = $("#element").text();
    var words = text.split(" ");
    var dictionary = new Array();
    for(var i=0; i < words.length; i++) {
        dictionary[i] = words[i];
        alert("dictionary elements are  :"+dictionary[i]);
    }

    </script>


    <script>

    function dic(word) {
        alert("Word passed for searching :"+word);
        // var dictionary = new Array("Java","Python","Swift","HTML","PHP");
        // This line is unnecessary; use the dictionary var already created.
        var flag = 0;
        for(var i = 0; i < dictionary.length; i++) {
            if(dictionary[i] == word) {
                document.getElementById("result").innerHTML = "Element Found";
                flag = 1;
            alert("Element found ");
                break;
            }
            if(i == dictionary.length - 1) {
                document.getElementById("result").innerHTML = "Element Not Found"; 
            alert("Element not found ");
            }
        }
    }

    </script>

Я новичок в разработке веб-сайтов.

Answer 1

Я решил вашу проблему, но я использую не текстовый файл, а json (из-за проблемы с CORS в скрипте), но если вы создадите текстовый файл, он будет работать так же. Одна строка для одного слова подсказки в файле.

function populateList(val)
{
  let textComponent = document.getElementById('textdata');
  let tooltip = document.getElementById('tooltip');
  let selectedText;
  let startPos = textComponent.selectionStart;
  let endPos = textComponent.selectionEnd;
  selectedText = textComponent.value.substring(startPos, endPos);

  fetch('https://api.myjson.com/bins/z9wr6').then(data=>data.json()).then(data=>{
   let text = data.result.split('\n').reduce((acc,e)=>{
   acc.push(Array.prototype.concat.call([],e.split(' ')))
   return acc
  },[]);
  text.forEach(e=>{
    if(e.find(ele=>ele===selectedText)){
      tooltip.innerHTML = e.join(', ')
    } 
   })
 })
}

И рабочая скрипка: https://jsfiddle.net/bfx8jdgh/