2015-07-07 4 views
1

пытается мои руки на PHP Javasript и JQuery учебники и я следующие error.the учебники можно найти hereЗагрузка JQuery библиотеки дает ошибку

ниже ошибка из консоли хром браузера.

Failed to load resource: net::ERR_FILE_NOT_FOUND 
auto-complete.js:2 Uncaught ReferenceError: $ is not defined 

html-код приведен ниже.

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Auto-complete tutorial</title> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
    </script> 
     <script src="auto-complete.js"></script> 
    </head> 
    <body> 
     <input type="text" value="" placeholder="Search" id="keyword"> 
    </body> 
</html> 

Javascript:

var MIN_LENGTH = 3; 
    $(document).ready(function() { 

     $("#keyword").keyup(function() { 
      var keyword = $("#keyword").val(); 
      if (keyword.length >= MIN_LENGTH) { 
       $.get("auto-complete.php", { keyword: keyword }) 
       .done(function(data) { 
        console.log(data); 
       }); 
      } 
     }); 

    }); 

это код PHP

<?php 
    $data = array("alpaca", "buffalo", "cat", "tiger"); 
    echo json_encode($data); 
    ?> 

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

XMLHttpRequest cannot load file:///C:/Users/Faisal/Desktop/auto_1/auto- 
    complete.php?keyword=abc. Cross origin requests are only supported for 
    protocol schemes: http, data, chrome, chrome-extension, https, chrome- 
    extension-resource.k.cors.a.crossDomain.send @ 
    jquery.min.js:4n.extend.ajax @ jquery.min.js:4n.(anonymous function) @ 
    jquery.min.js:4(anonymous function) @ auto-complete.js:6n.event.dispatch 
    @ jquery.min.js:3r.handle @ jquery.min.js:3 
    jquery.min.js:4 XMLHttpRequest cannot load 
    file:///C:/Users/Faisal/Desktop/auto_1/auto-complete.php?keyword=abcd. 
    Cross origin requests are only supported for protocol schemes: http, data, 
    chrome, chrome-extension, https, chrome-extension- 
    resource.k.cors.a.crossDomain.send @ jquery.min.js:4n.extend.ajax @ 
    jquery.min.js:4n.(anonymous function) @ jquery.min.js:4(anonymous function) 
    @ auto-complete.js:6n.event.dispatch @ jquery.min.js:3r.handle @ 

jquery.min.js:3jquery.min.js:4 XMLHttpRequest cannot load 
file:///C:/Users/Faisal/Desktop/auto_1/auto-complete.php?keyword=abcde. 
     Cross origin requests are only supported for protocol schemes: http, 
    data, 
    chrome, chrome-extension, https, chrome-extension- 
    resource.k.cors.a.crossDomain.send @ jquery.min.js:4n.extend.ajax @ 
    jquery.min.js:4n.(anonymous function) @ jquery.min.js:4(anonymous function) 
    @ auto-complete.js:6n.event.dispatch @ jquery.min.js:3r.handle @ 
jquery.min.js:3 

jquery.min.js:4 XMLHttpRequest cannot load 
    file:///C:/Users/Faisal/Desktop/auto_1/auto-complete.php?keyword=abcdef. 
    Cross origin requests are only supported for protocol schemes: http, data, 
    chrome, chrome-extension, https, chrome-extension- 
    resource.k.cors.a.crossDomain.send @ jquery.min.js:4n.extend.ajax @ 
    jquery.min.js:4n.(anonymous function) @ jquery.min.js:4(anonymous 
    function) @ auto-complete.js:6n.event.dispatch @ jquery.min.js:3r.handle @ 
    jquery.min.js:3 
+2

вашего скрипта 'уаг min_length ...' должен быть внутри тегов – depperm

+0

также отнести да Youre отсутствующего ''

2

Эта часть ошибки говорит все:

не могу загрузить файл: /// C: /Users/Faisal/Desktop/auto_1/auto-complete.php ключевого слова = а

Вы открываете страницу с файловой системой, а не с веб-сервера. Это решительно ограничит то, что вы можете сделать с точки зрения, ну, веб-материалов. JavaScript не позволит вам делать запросы AJAX из протокола file://, главным образом потому, что «файлы» не отвечают на HTTP-запросы.

Вы также не будете иметь возможность использовать неявные протоколы для ссылки на внешние ресурсы:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Лучше всего, чтобы создать какой-то простой веб-сервер на рабочей станции для тестирования кода.В противном случае вы собираетесь создавать обходные пути для своего кода, который не понадобится в размещенной среде, поэтому то, что вы тестируете, не будет тем, что вы в конечном итоге развертываете.

+0

Я использую сервер wamp, и он по-прежнему дает такую ​​же ошибку. –

+0

@faisalabdulai: Возможно, он установлен, но вы не используете его. Запрос 'file: //' определенно не использует веб-сервер. – David

+0

попытался загрузить через localhost и получил желаемые результаты, но он все еще дает ошибку статуса 403. –

Смежные вопросы