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标签最底层。 

  • 相关阅读:
    NHibernate 过滤器(第十五篇)
    NHibernate 存储过程 第十四篇
    NHibernate 操作视图 第十三篇
    NHibernate Linq查询 扩展增强 (第九篇)
    NHibernate 之数据操作 (第五篇)
    NHibernate之一级缓存(第十篇)
    jQueryEasyUI
    linux的systemctl 命令用法 转
    linux dig命令 转
    OPTAUTH 两步验证详解
  • 原文地址:https://www.cnblogs.com/loveprogramme/p/10822652.html
Copyright © 2011-2022 走看看