代码如下:

<%@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="stylesheet">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
</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>

jQuery动态添加li标签并添加属性和绑定事件的更多相关文章

  1. 动态生成li标签,并设置点击事件

    今天要解释的是如下界面              主要实现了: 1.模拟后台的json数据,动态生成li标签 2.导航栏的下划线 3.给li标签右边设置图片 4.动态生成的li标签,设置选中的li的点 ...

  2. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  3. js 重写a标签的href属性和onclick事件

    适应场景:假如移动端拨打电话,需要给a标签添加href属性,但是由于需求,需要链接跳转的同时给a标签添加onclick事件,如果不做任何处理的话,默认执行点击事件,而不会跳转href属性的链接. 怎么 ...

  4. jquery轻松实现li标签上下滚动的原理

    在网站上我们常看到有滚动的文字或者图片,比如消息提醒,新闻列表,等等.那么这些效果是怎么形成的呢?经过查阅,找到一种十分方便的写法,经过改良,得出我自己的终极版滚动效果. 我先写个布局吧 <di ...

  5. 关于li标签的value属性值的获取问题

    在前几天的开发过程中,遇到了这样一个问题. 在li标签中嵌入了一个value属性,如这样滴: <li id="ts1" value="0001">& ...

  6. 添加script标签、添加事件

    添加script标签 var _hmt = _hmt || [];    (function () {        var hm = document.createElement("scr ...

  7. Vue系列——动态设置img标签的src属性

    声明 本文转自:vue动态设置img的src路径 正文 相信开发的小伙伴已经遇到这个问题了,动态切换img标签的src时,写的路径就是不生效,原因是vue并没有把你的路径字符串当做路径来处理,而是直接 ...

  8. 【jquery】 在异步加载的元素上绑定事件

    最近因为工作关系又重新回归到了jquery的怀抱,发现很多jquery的一些细节处理的部分都忘记了.这里记录一下最近在做项目时频繁遇到的一个问题:给异步加载的元素添加事件绑定. 问题发生的前提是项目前 ...

  9. jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?

    思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...

随机推荐

  1. UML类图介绍以及PlantUML使用方法

    类的UML表示方法 UML介绍 类图,是UML(统一建模语言)中用于描述"类"以及"类与类"之间的示意图.它形象的描述出了系统的结构,帮助人们理解系统. 类图是 ...

  2. Elasticsearch 映射操作

    一.创建 语法: PUT /索引库名称/_mapping/类型名称 { "properties": { "字段名": { "type": 类 ...

  3. 用for循环求1-100的所有数的和

    2.求1-100的所有数的和 x=0for y in range (1,101): x=x+yprint(x)#Python for循环中可以循环一个列表或者某一个字符串下面是for的基本格式,英文是 ...

  4. Leecode刷题之旅-C语言/python-202快乐数

    /* * @lc app=leetcode.cn id=202 lang=c * * [202] 快乐数 * * https://leetcode-cn.com/problems/happy-numb ...

  5. Struts2获取Servlet的api的两种方式,解决ParameterAware过时的问题

    servlet API通过ActionContext进行获取 Struts2对HttpServletRequest,HttpSession和ServletContext进行了封装,构造了3个Map对象 ...

  6. Splay初学习

    例题传送门 听YZ哥哥说Splay是一种很神奇的数据结构,所以学习了一下它的最基本操作.O(1)的Spaly. 伸展树(Splay Tree),也叫分裂树,是一种二叉排序树,它能在O(logn)内完成 ...

  7. C#从Gif中提取图片

    C#从Gif中提取图片的代码片段 private void btn_extract_Click(object sender, EventArgs e) { Image imgGif = Image.F ...

  8. NB-IOT移植移动onenet基础通信套件之Object_ID,实例ID,资源ID

    1. 访问是按照分层的,Object_ID/实例ID/资源ID,对应每一层ID的数据类型,目前是分为3层,一个实例下面可以有多个实例id,对下面的数据结构来说,如果是资源ID的话,类型只能是asBuf ...

  9. NSNull Crash处理 (NullSafe 的原理)

    问题场景 后端返回的数据中总会出现一些NSNull类型,当我们一处理程序就会崩溃,因此想到把返回的数据中的NSNull类型全部转换成@""空字符串 (1)原始的json串:后端返回 ...

  10. Python对象引用问题总结

    对于对象引用问题,一直是一知半解的状态,现整理以备使用. 操作不可变对象进行加减运算时,会在内存中创建新的不可变实例,不会影响原来的引用>>> c=12>>> d= ...