函数无法识别页面变量

Question

I have 2 pages that has the logout functionality within it...Currently the html page looks as below...The test1.js has the Logout function and whenever the user clicks the logout button the Logout function is called.. The logout function calls a post request in the server passing the session id and csrf token...

Problem:

In this current setup, I'm unable to get the csrf and session id from the pages but when I move it inside the document.ready function of individual page it works fine..

Why the session id and csrf function is not visible if its separate..

Page1.html

    <script src="test1.js"></script>
    <form id="searchform" method="post" action="Search">
        <input type="hidden" name="CSRF" value="{{acsrf}}" />
        <input type="hidden" name="ses_id" value="{{session_id}}" />
        <div>
            <input name="search_string" id="search_string" type="text">
            <input id="searchbutton" name="submit" value="Search" class="input_submit" type="submit">
        </div>
    </form>


    <ul>
      <li id="logoutLink"><a href="#">Logout</a></li>
    </ul>

    $(document).ready(function(){
      $('#logoutbutton').click(Logout)     
    })

Page2.html

<script src="test1.js"></script>

<ul>
  <li id="logoutLink"><a href="#">Logout</a></li>
</ul>

$(document).ready(function(){
  $(#logoutbutton).click(Logout)     
})

test1.js

function Logout() {
      $.post("Logout",
       { antiCSRF: '{{acsrf}}',
         session_id: '{{session_id}}'
    });
      alert("You are now logged out.");
      window.location = './';

}

Answer 1

The problem is that your test1.js file cannot access the values from the django template. If you put your javascript inline it should work but adding an external script django treat it as an static file.

This post could be helpful