在用js拼接html时,给元素加不上事件的问题

  • 问题描述:有时,发起ajax请求成功后,需要用js去拼接一小段html字符串,然后给某些元素添加事件时,事件总是加不上。
  • 解决办法:在success 回调函数内,给元素添加事件绑定。
  • 代码如下

$.ajax({
url : initDeniedUrl,
dataType: “json”,
type:’post’,
xhrFields: {
withCredentials: true
},
data:JSON.stringify({‘page’:1,’pageSize’:5}),
contentType: ‘application/json; charset=utf-8’,
success : function(res) {
var htmlStr = “<ul class=’artile-wap’>” + “<span class=’rfuse-circular2′></span>”;
$(‘div’).append(htmlStr);
$(‘ul’).on(‘click’,function(){
alert(‘事件绑定上了’);
});
}
});

时间: 2024-08-08 17:49:30

在用js拼接html时,给元素加不上事件的问题的相关文章

JS魔法堂:IMG元素加载行为详解

一.前言 在<JS魔法堂:jsDeferred源码剖析>中我们了解到img元素加载失败可以作为函数异步执行的优化方案,本文打算对img元素的加载行为进行更深入的探讨. 二.资源加载的相关属性和事件 资源加载首先当然是确定资源位置的 src属性 .随之就是资源加载成功与否的 onload事件 和 onerror事件 ,对于IE5~10来说还多了一个 onreadystatechage事件 和与该事件相关联的 readyState属性 和 complete属性 . onload事件 ,当资源加载完

每日分享!~ 使用js原生方式对拖拉元素(鼠标的事件)

一个元素放置页面上.如何进行拖拉,实现想放哪里就放哪里的效果呢? 效果如下: 如果让你写这个效果,你会如何写呢? --- 思路分析:我首先想到的是,对这个元素先绑定一个事件.(什么事件? 那当然是鼠标按下时的事件啦? )   那么绑定这个事件具体做啥子呢? 在绑定这个事件之前.我们需要先了解如下几个事情-- 1. 元素如何才能在页面上移动?  (是不是要脱离文档流呢? OK / 这时我们给设置一个position:absolute /  让其绝对定位. 2. 获取元素当前距离页面两边的位置 3.

js 拼接字符串时,本来想要’#1′ ,返回的却是’#01′

今天在操作一个元素时,id值是拼接的. var index = $(this).attr(‘index’);    //0var id = ‘#’ + (index+1);    //#01$(id).attr(‘style’,”); 正确处理:parseInt函数 var index = parseInt($(this).attr(‘index’));    //0var id = ‘#’ + (index+1);    //#1$(id).attr(‘style’,”);

为同一个元素绑定不同的事件指向同一个事件的处理函数

<input type="button" value="点击" id="btn"/><script src="commer.js"></script><script> //为同一个元素绑定不同的事件指向同一个事件的处理函数 ver("btn").onclick=f1; ver("btn").onmouseover=f1; ver("

js实例_当鼠标移动到某个元素上时在元素下面显示一段提示文字

效果: 当鼠标不在自动登录上时,只显示自动登录这个表单,下面的div提示则隐藏. 当鼠标移动到自动登录这个表单时,则显示下面的div提示,当鼠标移出时再将其隐藏 代码实现与原理: HTML代码: <body> <input type="checkbox" />自动登录 <div id="div1">不要再玩游戏啦!!!</div> </body> CSS代码:给id为div1的元素做一下修饰,并且将其最开始

MVC中使用js拼接的元素验证问题

MVC使用的验证方式本质上是jquery.validation js  拼接的格式如下: <input class='required' title='请输入项目名称!' id='ProjectList_ProjectName' value='' name='ProjectList.ProjectName' type='text' style='width:120px' /> <span data-valmsg-for="ProjectList.CarrySatus"

使用ASP.NET MVC局部视图避免JS拼接HTML,编写易于维护的HTML页面

以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观.简捷.易于维护,由于不用JS拼接HTML,所以JS写的也很少. 最近使用ASP.NET MVC开发,前台页面的功能比较复杂,每次刷新整个页面的话体验会很差,所以通过JS控制页面元素,实现局部刷新.刚开始使用的方法是通过JS在前台拼接HTML,结果JS写的很长,要命的事,每增加一个新功能,都要拼接很长的HTML,结果页面的JS越

js页面滚动时层智能浮动定位实现:

案例展示: 第一个:每个人都有看过的淘宝页面: 案例就不多说了,有兴趣的可以多去找找, 这样的智能浮动效果还是不错的,挺方便. 基本的实现原理: 首先有一个默认状态就是没有滚动的时候,什么事情也不用做,定位可以是absolute,也可以是stati,fixed,relartive 这些都可以.我们主要需要关注的是当浏览器滚动的时候,(要浮动的块)要移除浏览器界面视区的时候,修改其position属性,让其浮动在窗口的上沿显示就可以了.最好的position属性就是fixed了,可以在IE6+和其

JS魔法堂:LINK元素深入详解

一.前言 我们一般使用方式为 <link type="text/css" rel="stylesheet" href="text.css"> 来引入外部层叠式样式文件,但LINK元素各属性的具体含义.资源加载行为等方面却了解不多,本文打算稍微深入一下. 由于内容较多,特设目录一坨: 二.到底有没有结束标签? 三.普通属性介绍 四.属性disabled详解 1. Attribute和Property的disabled  2. disab