zoukankan      html  css  js  c++  java
  • 关于jQuery事件绑定放在head中没有响应的问题

    1、问题代码如下

    <html lang="en<head>

        <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"
    integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
    crossorigin="anonymous"></script>
    <script>
    $(":text").blur(function () {
    $.post("/ajax_jq/", {username:"alex"}, function (data) {
    $(".error").text(data);
    })
    });
    </script>
    </head>
    <body>
    <form>
    <p><label>用户名:</label><input type="text" name="username">
    <br />
    <span class="error"></span>
    </p>
    <p><label>密码:</label><input type="password" name="password"></p>
    <p><input type="submit" value="提交"></p>
    {% csrf_token %}
    </form>
    </body>
    </html>

    2、异常说明
      本段代码功用是:当输入完用户名,在失去焦点后,用jQuery实现异步加载,判断用户名已存在,但是尝试了半天都没有发送异步请求。

    3、解决方案
      将事件调用放在$(document).ready(function(){
      // code
    }
    );
    或者
    $(
    function(){
    // code
    }
    )或者
    将事件调用的script标签放在body标签最下面

     4、收获

      如果没有将script代码中的代码放在加载函数中(加载函数:加载完文档后,才开始执行加载函数里面的代码)或者head标签最底层,那么浏览器在

    解释HTML文档时,就会先给一个元素绑定一个事件,但是由于该元素还没有加载出来,就会导致事件绑定在一个不存在的元素上,使执行结果与预期大相径庭。

     5、提示

      以后再在HTML中写js的时候,最好将js代码放在加载函数或者head标签最底层。 

  • 相关阅读:
    vim how to set nu with 0-index instead of 1-index
    @property的介绍与使用
    X[:,0]和X[:,1]
    the best guide for git
    sorted(列表)
    Java的匿名函数
    成员变量和局部变量的区别
    Java数组合并
    Java中random的使用
    Git常见错误---git branch不显示本地分支的问题
  • 原文地址:https://www.cnblogs.com/loveprogramme/p/10822652.html
Copyright © 2011-2022 走看看