My jquery function doesn't work with django

Can't run jquery with my django html page.

I tried to run with html and it's work. But with django nothing happens.

Here's my main_page.html :

{% load static %}
<html>
    <head>
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <link rel="stylesheet" href="{% static 'js/blog.js' %}">
        <link rel="stylesheet" href="{% static 'css/blog.css' %}">

    </head>
    <body>
        <div class="form-group">
          <textarea class="text" style="display:inline" id="Textarea" ></textarea>
          <textarea class="text" style="display:inline" disabled="disabled" id="Textarea2"></textarea>

        </div>
        <button>Translate</button>
    </body>
</html>

and my blog.js file under static/js/blog.js :

$(document).ready(function(){
  $("button").click(function(){
    $("#Textarea2").hide();
  });
});

I expect for the Textarea2 to hide.

2 answers

  • answered 2019-07-21 14:11 Saurabh Pabhare

    1. Make sure your setting.py has STATIC_URL = '/static/'
    2. Set the STATIC_ROOT setting to the directory from which you’d like to serve these files STATIC_ROOT = "/var/www/example.com/static/"
    3. Run the collectstatic management command: python manage.py collectstatic

  • answered 2019-07-21 14:16 charlietfl

    <link> is not for javascript, you need a <script> tag

    Change

    <link rel="stylesheet" href="{% static 'js/blog.js' %}">
    

    To

    <script src="{% static 'js/blog.js' %}"></script>