Базовый Javascript onclick вызов функции не работает

Question

У меня есть вход и две кнопки, каждая из которых должна изменить текст в поле ввода. Если я поставлю одну строку кода внутри onclick напрямую, она работает отлично. Если я переведу линию на отдельную функцию и попытаюсь вызвать ее через onclick, ничего не произойдет, и я не знаю, почему.

Я рассмотрел многие другие вопросы о onclick, но ни один из них, похоже, не помог в этом. Я в тупике. JSFiddle здесь: https://jsfiddle.net/wjw00h44/2/

Соответствующий код:

<div class="container"> 
    <div class="row"> 
     <div class="col-sm-8"> 
      <input type="text" class="form-control" id="noun-sentence" placeholder="Enter a sentence here"> 
     </div> 
     <button type="button" class="btn btn-default" onclick="document.getElementById('noun-sentence').value = 'go away'">Check</button> 
     <button type="button" class="btn btn-default" id="noun-button" onclick="changeWords()">Check2</button> 
    </div> 
    <p id="test_p"></p> 
</div> 

<script> 
    function changeWords() { 
     document.getElementById('noun-sentence').value = 'go away'; 
     return false; 
    } 
</script> 

Answer 1

В Js скрипку, нажмите на значок шестеренки в яваскрипта окне и изменить, как скрипт загружает. Не помещайте его ни в одно из событий «on», но прямо в элементы головы или тела. Затем нажмите «запустить» и повторите попытку.