JQuery keyup не вызывает оповещения - PullRequest
Новая
       7

JQuery keyup не вызывает оповещения

0 голосов
/ 25 сентября 2018

Я тестирую keyup(), отправляя предупреждение при наборе текста в текстовом поле, но ничего не происходит.Не уверен, нужно ли мне ставить отдельные скобки или я не смог включить библиотеку. 

    <html>
        <head>
            <title>City Finder</title>
            <script 
             src="http://code.jquery.com/jquery-3.2.1.min.js">
             
              
             $(document).ready(function()
             {
                  $( "#cityField" ).keyup(function()
                  {
                      window.alert("Handler for .keyup() called.");
                  });
             });
            </script>
        </head>
        <body>
            <form>
                Enter A Utah City: <input type = "text" id="cityField" value= ""><br>
                Suggestion: <span id="txtHint">Empty</span>
                <input id="weatherButton" type ="submit" value="Submit">
            </form>
            <p>City</p>
            <textarea id = "displayCity">No City</textarea>
            <p>Current Weather</p>
            <div id="weather">No Weather</div>
            <input type = "button" onclick = alert("hello"); name = "ok" value = "Climb out window">
           
    
    </html>

Ответы [ 2 ]

0 голосов
/ 25 сентября 2018

Просто закройте первое включение внешнего скрипта и запустите другой тег скрипта, сработавший для меня. 

<html>
        <head>
            <title>City Finder</title>
            <script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
           <script>
              $(document).ready(function(){
            
        
                  $("#cityField").keyup(function()
                  {
                      alert("This works");
                  });
             });
            </script>
        </head>
        <body>
            <form>
                Enter A Utah City: <input type = "text" id="cityField" value= ""><br>
                Suggestion: <span id="txtHint">Empty</span>
                <input id="weatherButton" type ="submit" value="Submit">
            </form>
            <p>City</p>
            <textarea id = "displayCity">No City</textarea>
            <p>Current Weather</p>
            <div id="weather">No Weather</div>
            <input type = "button" onclick = alert("hello"); name = "ok" value = "Climb out window">
           
    
    </html>
0 голосов
/ 25 сентября 2018

У вас были некоторые семантические проблемы (например, не закрытие тега body) и пара опечаток - Также я переместил блок скрипта в конец страницы, чтобы страница могла загружаться до вызова скрипта.Убедитесь, что вы закрываете теги скрипта при вызове внешнего js-файла на страницу - они должны быть в своих собственных тегах скрипта - а не соединяться с блоком javascript на странице.Также я добавил тип документа HTML5 и текст-заполнитель для текстовой области.У вас также должны быть метки для ваших входных данных.

Также - для отладки лучше использовать console.log (), а не alert. 

<!doctype html>
 <head>
   <title>City Finder</title>
 </head>
 <body>
   <form>
    <label for ="cityField"> Enter A Utah City:</label>
     <input type = "text" id="cityField" value= ""><br>
      Suggestion: <span id="txtHint">Empty</span>
     <input id="weatherButton" type ="submit" value="Submit">
   </form>
   <label for="displayCity">City</label><br>
   <textarea id = "displayCity" placeholder="No city"></textarea>
   <p>Current Weather</p>
   <div id="weather">No Weather</div>
     <button type = "button" onclick = "alert('hello')" name = "ok" >Climb out window</button>
            
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
 $(document).ready(function() {
    $( "#cityField" ).keyup(function() {
        console.log("Handler for .keyup() called.");
    });
  });
</script>
</body>
</html>
...