Javascript из внешнего файла не загружается - PullRequest
2 голосов
/ 16 марта 2012

У меня есть проблема с Javascript, которая продолжает беспокоить меня довольно долго.У меня есть внешний файл с именем search.js, который находится в той же папке, что и файл .html, в который он загружен.

Кусок кода, который я использую в HTML для загрузки файла javascript:

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

Со всех сайтов, которые я читал, я не могу найти здесь проблемы с кодом.

Кроме того, я знаю, что синтаксис в файле javascript должен быть правильным, чтобы ончтобы работать, так вот мой код Javascript из search.js :

$(document).ready(function(){
    $('#searchForm').submit(function(){
        var lookfor = $("#billSearched").val();
        alert(lookfor);
        var a = $(this).attr('action');
        alert(a);
        a = a.replace("__search_term__",lookfor);
        alert(a);
        window.location.href = a;
        return false;
    });
});

Я запустил этот код в другом проекте, и он работал нормально, все, что яизменились имена полей, т.е. billSearched.

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

Заранее спасибо!

РЕДАКТИРОВАТЬ

Полный HTML-код:

<html>
<head>
    <title>Bills</title>
    <script type="text/javascript" src="/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/search.js"></script>
    <link rel="stylesheet" href="style.css"> 
</head>
<body bgcolor="#0066CC" color="FFFFFF">
    <table>
        <tr>
            <td style="color:white"><b>Products</b></td>
            <td style="color:white">Price</td>
            <form method="POST" id="searchForm"  action="{% url ps.views.search searchTerm='__search_term__' %}">
                {% csrf_token %}
                <td><input type="text" id="billSearched"></td>
                <td><input type="submit" value="Search"></td>
            </form>
        </tr>
        {% for x in products %}
        <tr>
        <td style="color:white">{{ x.name }}</td>
        <td style="color:white">{{ x.price }}</td>
        </tr>
        {% endfor %}
    </tr>
</table>
</body>

Ответы [ 3 ]

3 голосов
/ 16 марта 2012

По тегам и коду вашего шаблона я понял, что вы используете Django. Чтобы понять вашу проблему, вам нужно понять, как представления Django работают по отношению к вашему браузеру, и что происходит, когда ваш браузер выдает запрос на определенный URL.

Что происходит на стороне Django:

Что происходит, когда вы запрашиваете URL-адрес, так это то, что ваш базовый файл urls.py будет искать шаблон, соответствующий вашему URL-адресу. Если шаблон встречается, то будет вызван соответствующий view.
view выполнит свою логику и будет использовать template для преобразования своего ответа в html.

Что происходит с точки зрения вашего браузера

Браузер запросил URL и получил ответ, он не знает о том, что было вызвано представление, и что он где-то извлек шаблон.

Что это значит для вас

Тот факт, что ваш search.js файл расположен рядом с вашим шаблоном, совершенно не имеет значения , так как ваш браузер никогда не запрашивал какой-либо файл из этого каталога , это view, который сделал, когда он получил его template.

На самом деле, запрос вашего браузера на search.js будет переадресован на Django вашим веб-сервером и, скорее всего, приведет к ошибке 404, если search.js не преобразуется в представление в urls.py.

Как вы можете использовать это для решения вашей проблемы

Вам нужно будет подать файл search.js из каталога, к которому может получить доступ браузер. Обычно это делается в три этапа:

  1. Сконфигурируйте ваш веб-сервер так, чтобы он самостоятельно обслуживал любой путь, начинающийся с /static/ (каким-то образом это означает, что запрос не переадресовывается на Django).
    В Apache вы бы использовали следующее правило: Alias /static/ /YOUR/STATIC/DIRECTORY/

  2. Настройте Django settings.py для использования /YOUR/STATIC/DIR в качестве STATIC_ROOT и /static/ в качестве STATIC_URL.

  3. Поместите файл search.js в свой /YOUR/STATIC/DIR/

  4. Используйте src="/static/search.js для ссылки на ваш файл в шаблоне html.

И последнее: если вы используете сервер разработки, вам может потребоваться, чтобы ваш STATIC_URL начинался с полного пути к вашему серверу, включая порт. (Или у вас могут быть проблемы с политиками безопасности браузера).

Несколько дополнений:

Вы должны использовать теги шаблона, чтобы вам не приходилось писать /static/ в вашем шаблоне.
Вы должны использовать manage.py collectstatic для автоматического размещения статических файлов в вашем статическом каталоге.

Самое главное, Вы должны исследовать, что модель Django MVC (или MTV) имеет отношение к .

0 голосов
/ 19 марта 2012

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

  • Добавить папку '/ static /' в STATIC_URL и STATICFILES_DIRS в файле settings.py
  • Импортировать файлы .js (search.js и источник jQuery) со следующими командами в следующем порядке:

    <script type="text/javascript" src="/static/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/static/search.js"></script>
    
  • и создайте соответствующую файловую структуру, поместив «статический» файл в корневой каталог проекта.

    т.е. Psroot:

  • psApp
  • статические
  • шаблоны
  • и остальные файлы (settings.py, urls.py, manage.py и т. д.)
0 голосов
/ 16 марта 2012

Пути с префиксом / указывают на корень, а не на текущую папку.В этом случае вы хотите удалить префикс /.

Ваши HTML-файлы на project/ps/templates/bill.html, который связывает JS-скрипт /search.js, означают, что он ищет файлы в совершенно неправильном месте.

Например, вы можете увидеть, как он разрешает путь, если вы добавите ссылку на /search.js в своем HTML.

В иллюстративных целях создайте файл HTML на рабочем столе:

<html>
<body>

<a href="/foobar.txt">Hello</a>
<a href="foobar.txt">World</a>

</body>
</html>

При наведении курсора на ссылку вы увидите, что Hello разрешается до file:///foobar.txt, а World - по пути к вашему рабочему столу - в моем случае file:///C:/Users/thm.ARC/Desktop/foobar.txt.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...