关于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标签最底层。
关于jQuery事件绑定放在head中没有响应的问题的更多相关文章
- Jquery事件绑定的4中方式对比
bind()向匹配元素添加一个或多个事件处理器. 使用方式 $(selector).bind(event,data,function) event:必需项:添加到元素的一个或多个事件,例如 click ...
- jQuery事件绑定和委托实例
本文实例讲述了jQuery事件绑定和委托.分享给大家供大家参考.具体方法如下: jQuery事件的绑定和委托可以用多种方法实现,on() . bind() . live() . delegate ...
- 深入学习jQuery事件绑定
× 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...
- jQuery事件绑定、解绑、命名空间
jQuery事件绑定.解绑.命名空间 <%@ page language="java" import="java.util.*" pageEncoding ...
- jQuery 事件绑定 和 JavaScript 原生事件绑定
总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind.live.delegate.o ...
- JQuery事件绑定,bind与on区别
jquery事件绑定bind:向匹配元素添加一个或多个事件处理器 $(selector).bind("click",data,function); live:向当前或未来的匹配元素 ...
- jQuery事件绑定和委托
可以用多种方法实现,on() . bind() . live() . delegate() ,还有one(). 有时我们可能会像下面这样绑定一个事件: $("#div1"). ...
- jQuery事件绑定的最佳实践
如果你经常使用jQuery,那么你也许很熟悉事件绑定.这是很基本的东西,但是深入一点,你就能够找到机会让你事件驱动的代码变得不太零碎,并且更容易管理. 更好的选择器策略 让我们从基础的例子开始.下面的 ...
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
随机推荐
- Debian8.8解决双系统访问windows磁盘时,有时能成功挂载,有时不能成功挂载的情况
1.确保在debian下安装了挂载工具.2.进入windows关闭windows快速启动功能,关闭办法是控制面板,在电源管理中,选择关闭盖子的功能,点击“更改不能更改的选项”,去掉快速启动的钩,重启进 ...
- drf中的请求模块和渲染模块
请求模块:request对象 APIView request.py # 在rest_framework.request.Request实例化方法中 self._request = request 将原 ...
- getWeekDay TimeUtil
package me.zhengjie.common.utils; import java.util.Calendar; import java.util.Date; /** * @author ji ...
- Linux 杀死进程方法大全(kill,killall)
杀死进程最安全的方法是单纯使用kill命令,不加修饰符,不带标志. 首先使用ps -ef命令确定要杀死进程的PID,然后输入以下命令: # kill -pid 注释:标准的kill命令通常 ...
- 让Spring不再难懂-ioc篇
写过java的都知道:所有的对象都必须创建:或者说:使用对象之前必须先创建.而使用ioc之后,你就可以不再手动创建对象,而是从ioc容器中直接获取对象. 就好像我们无需考虑对象的销毁回收一样,因为ja ...
- EXAM-2018-8-10
EXAM-2018-8-10 F 突然卡了一会的水题 M 这题有点坑 考虑到一个数列的第一个数肯定会有 我们可以贪心的认为最优的方案是一个数列的第一个与另一个数列所有数的和.但是很容易找到反例 1 2 ...
- Office customUI中如何动态更新控件标题和图标?
本例,在Excel右键菜单中创建一个按钮,按钮的标题使用getLabel动态获取,图标使用getImage动态获取. customUI XML代码: <customUI xmlns=" ...
- WebService客户端生成方法
1.使用JDK的wsimport.exe产生客户端代码 打开cmd命令框,输入如下格式命令: 格式:wsimport -s "src目录" -p "生成类所在包名&quo ...
- 浏览器加载、渲染html的顺序和页面优化
浏览器加载和渲染html的顺序 1. IE下载的顺序是从上到下,渲染(就是把请求的内容显示到浏览器屏幕上)的顺序也是从上到下,下载和渲染是同时进行的. 2. 在渲染到页面的某一部分时,其上面的所有部分 ...
- [LC] 112. Path Sum
Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that adding up all ...