js动态添加li,你添加的li具有你绑定的事件
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<
html
>
<
head
>
<
meta
http-equiv
=
"Content-Type"
content
=
"text/html; charset=UTF-8"
>
<
title
>Insert title here</
title
>
<
script
type
=
"text/javascript"
src
=
"http://www.daimajiayuan.com/download/jquery/jquery-1.10.2.min.js"
></
script
>
<!-- 3.0 -->
<
link
href
=
"http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"
rel
=
"external nofollow"
rel
=
"stylesheet"
>
</
head
>
<
body
>
<
ul
id
=
"listproject"
class
=
"list-group"
>
<
script
type
=
"text/javascript"
>
var JSarray = new Array();
JSarray[0] = "array0";
JSarray[1] = "array1";
JSarray[2] = "array2";
JSarray[3] = "array3";
JSarray[4] = "array4";
for(var i = 0;i<
5
;i++){
$("#listproject").append("<li
id
=
li
"+i+">"+JSarray[i]+"</
li
>"); //在ul标签上动态添加li标签
$("#li"+i).attr("class",'list-group-item'); //为li标签添加class属性
}
$('li').on('click',function(){ //绑定事件
alert("事件绑定成功!");
});
</
script
>
</
body
>
</
html
>
js动态添加li,你添加的li具有你绑定的事件的更多相关文章
- 使用addeventlistener为js动态创建的元素添加事件监听
点击li弹出内容,并且动态添加li之后有效 <button onclick="addFunction()">点我增加</button> <ul> ...
- js动态向页面中添加表格
我们在实际开发中经常会想要实现如下情况: 点击某个按钮,然后动态的网页面里面添加一个表格或者一行,这个更加灵活方便.但是实现起来肯定不能像在页面里面直接写标签来的容易,以下是我项目中的代码,拿过来分享 ...
- 如何给js动态创建的dom添加事件
delegate() 方法 实例 当点击鼠标时,隐藏或显示 p 元素: $("div").delegate("button","click" ...
- js动态往对象里边添加一项
第一种方法let obj ={"name":"tom","age":16}let key = "id";let valu ...
- js动态加载html,加载后的页面元素某些事件失效的解决方案
用 live 来绑定 例如: $("#items li .addToCartimg").live("click",function(){ $('.popDeta ...
- JavaScript给动态插入的元素添加事件绑定
由于实际的需要,有时需要往网页中动态的插入HTML内容,并在插入的节点中绑定事件处理函数.我们知道,用Javascript向HTML文档中 插入内容,有两种方法, 一种是在写HTML代码写入JS,然后 ...
- ajax动态添加的li不能绑定click事件
单纯的给li标签添加click事件,是不会执行的. 经过试验 <ul id="searchedUser"><li>搜索结果</li></u ...
- 利用JS实现在li中添加或删除class属性
$( function() { $("#test li").click(function(){ $("#test li").removeClass(" ...
- js动态添加事件-事件委托
作者:白狼 出处:http://www.manks.top/javascript-dynamic-event.html 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给 ...
随机推荐
- WARNING: bridge-nf-call-iptables is disabled解决
执行docker info出现如下警告 WARNING: bridge-nf-call-iptables is disabledWARNING: bridge-nf-call-ip6tables is ...
- Vue 使用MD5 加密
第一步: npm安装: npm install --save js-md5 第二步: 全局引用 import md5 from 'js-md5'; Vue.prototype.$md5 = md5; ...
- linux的端口学习(一)
1.端口是什么? 1.1 是英文port的意译,可认为是设备与外界通讯交流的出口. 1.2 端口可分为虚拟端口和物理端口. 1.2.1 虚拟端口:指计算机内部或交换机路由器内的端口,不可见.例如计算机 ...
- JavaScript 闭包&基于闭包实现柯里化和bind
闭包: 1 函数内声明了一个函数,并且将这个函数内部的函数返回到全局 2 将这个返回到全局的函数内中的函数存储到全局变量中 3 内部的函数调用了外部函数中的局部变量 闭包简述: 有权访问另一个函数局部 ...
- 吴裕雄 PYTHON 神经网络——TENSORFLOW MNIST读取数据
from tensorflow.examples.tutorials.mnist import input_data mnist = input_data.read_data_sets("E ...
- 深入学习二叉树(07)B树
问题背景 在大型的数据库存储中,实现索引查找,如果采用二叉查找树的查找的话,由于节点的存储数据是有限的,这样如果数据库很大的话,就会导致树的深度过大从而造成磁盘 IO 操作过于频繁,就会造成效率低下 ...
- Java中几种office文档转pdf的方式
最近公司要做office的文档,搜集了几种office文档转pdf的方式,简单的做下总结 我主要尝试了三种方式:openoffice,aspose,jacob 对他们进行了大文件,小文件,在linux ...
- leetcode 0215
目录 ✅ 1002. 查找常用字符 描述 解答 java other's implementation(todo watch me) cpp py ✅ 821. 字符的最短距离 描述 解答 cpp p ...
- kafka中常用API的简单JAVA代码
通过之前<kafka分布式消息队列介绍以及集群安装>的介绍,对kafka有了初步的了解.本文主要讲述java代码中常用的操作. 准备:增加kafka依赖 <dependency> ...
- 洛谷 P1119 灾后重建(Floyd)
嗯... 题目链接:https://www.luogu.org/problem/P1119 这道题是一个Floyd的很好的题目,在Floyd的基础上加一点优化: 中转点k在这里不能暴力枚举,否则会超时 ...