Функция Basi c HTML JavaScript не работает должным образом

Question

Я брожу, если кто-нибудь может помочь. Я делаю несколько базовых c JS для проекта, но я идиот и не знаю, как сделать этот элемент.

Я использовал программу выделения слов с открытым исходным кодом, которую я нашел в Интернете, которая работает, когда я ввожу строку, которая должна быть выделена, но когда я ввожу «input_id.value», которое является рабочим (проверенным) значением поля ввода, подсветка не работает. Я подумал, что это может быть связано с тем, что он не обновляется, т.е. он запускается только один раз, поэтому он попытается выделить значение, поскольку ничего не было введено.

Это фрагмент кода:

<script type="text/javascript" src="../Resources/hilitor.js"></script>
<script type="text/javascript">

var input = document.getElementById("input_id").value;

    // global variable
    var myHilitor;
    document.addEventListener("DOMContentLoaded", function() {
        myHilitor = new Hilitor();
        myHilitor.apply("fox");
    }, false);


</script>

Это работает правильно и выделяет "лис", как показано на этом изображении.

Однако, когда я изменяю

myHilitor.apply("fox");

на

myHilitor.apply(input_id.value);

, ничего не выделяется вообще. Я пытался поместить все это в функцию, подобную идиоту, но это также не работает

<script type="text/javascript" src="../Resources/hilitor.js"></script>
<script type="text/javascript">
function searchFunction(){
    var input = document.getElementById("input_id").value;

    // global variable
    var myHilitor;
    document.addEventListener("DOMContentLoaded", function() {
        myHilitor = new Hilitor();
        myHilitor.apply("fox");
    }, false);
}

</script>

Функция вызывается

<button onclick="searchFunction()" class="button"></button>

Я действительно ошеломлен, любая помощь будет очень ценится Спасибо:)

Спасибо всем за полезный вклад, Проблема решена Я жду, чтобы принять ответ

Answer 1

Ваша переменная называется var input, но вы используете input_id здесь myHilitor.apply(input_id.value);

Answer 2

Вы объявили var input = document.getElementById("input_id").value;.

Но при вызове myHilitor.apply(input_id.value); вы передаете input_id.value. Вы должны пройти только input.

Как myHilitor.apply(input);

Answer 3

document.addEventListener("DOMContentLoaded", function() { заставляет функцию выполняться, когда происходит событие DOMContentLoaded (то есть, когда </html> анализируется при загрузке документа).

Вы не показали, как вызывается searchFunction, но есть вероятность, что именно при нажатии кнопки.

Это произойдет после событие DOMContentLoaded, поэтому условие для выполнения функции никогда не наступит.

Дон не включайте это условие.