jQuery动态添加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="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标签并添加属性和绑定事件的更多相关文章
- 动态生成li标签,并设置点击事件
今天要解释的是如下界面 主要实现了: 1.模拟后台的json数据,动态生成li标签 2.导航栏的下划线 3.给li标签右边设置图片 4.动态生成的li标签,设置选中的li的点 ...
- jQuery动态对表格Table进行添加或删除行以及修改列值操作
jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...
- js 重写a标签的href属性和onclick事件
适应场景:假如移动端拨打电话,需要给a标签添加href属性,但是由于需求,需要链接跳转的同时给a标签添加onclick事件,如果不做任何处理的话,默认执行点击事件,而不会跳转href属性的链接. 怎么 ...
- jquery轻松实现li标签上下滚动的原理
在网站上我们常看到有滚动的文字或者图片,比如消息提醒,新闻列表,等等.那么这些效果是怎么形成的呢?经过查阅,找到一种十分方便的写法,经过改良,得出我自己的终极版滚动效果. 我先写个布局吧 <di ...
- 关于li标签的value属性值的获取问题
在前几天的开发过程中,遇到了这样一个问题. 在li标签中嵌入了一个value属性,如这样滴: <li id="ts1" value="0001">& ...
- 添加script标签、添加事件
添加script标签 var _hmt = _hmt || []; (function () { var hm = document.createElement("scr ...
- Vue系列——动态设置img标签的src属性
声明 本文转自:vue动态设置img的src路径 正文 相信开发的小伙伴已经遇到这个问题了,动态切换img标签的src时,写的路径就是不生效,原因是vue并没有把你的路径字符串当做路径来处理,而是直接 ...
- 【jquery】 在异步加载的元素上绑定事件
最近因为工作关系又重新回归到了jquery的怀抱,发现很多jquery的一些细节处理的部分都忘记了.这里记录一下最近在做项目时频繁遇到的一个问题:给异步加载的元素添加事件绑定. 问题发生的前提是项目前 ...
- jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?
思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...
随机推荐
- 在 Ubuntu Linux 14.04 LTS 上安装php7
首先添加php官方源 $ sudo add-apt-repository ppa:ondrej/php 然后更新源 $ sudo apt-get update 然后安装 $ sudo apt-get ...
- day 17 成员
1.成员 在类中你能写的所有内容都是类的成员 2.变量 1. 实例变量:昨天写的就是实力变量,由对象去访问的变量 2. 类变量: 这个变量属于类.但是对象也可以访问 ...
- 【AD】自己画板的备忘
快捷键: [Ctrl + M ]计算出两点之间的距离,画电路板时会用到 [Ctrl + Q ]在设定X.Y..等等的地方,快捷键可以公英制快速切换 [shift + 空格键 ]在布线的同时,此快捷键可 ...
- web頁面優化以及SEO
轉載:https://blog.csdn.net/xustart7720/article/details/79960591 浏览器访问优化浏览器请求处理流程如下图: Etag:實體標籤.ETag是HT ...
- 第3天 Java基础语法
第3天 Java基础语法 今日内容介绍 引用数据数据类型(Scanner.Random) 流程控制语句(if.for.while.dowhile.break.continue) 引用数据类型 Scan ...
- Leecode刷题之旅-C语言/python-141环形链表
/* * @lc app=leetcode.cn id=141 lang=c * * [141] 环形链表 * * https://leetcode-cn.com/problems/linked-li ...
- struts2学习笔记二
一.分文件编写框架配置文件 1.不分文件开发可能产生的问题 就类似于我们在写java类时,所有代码都写在一个类里,甚至写在一个方法里. 当3个人都checkout了struts.xml文件时,第一个人 ...
- 【blockly教程】第二章 Blockly编程基础
2.1 Blockly的数据类型 2.1.1 数据的含义 在计算机程序的世界里,程序的基本任务就是处理数据,无论是数值还是文字.图像.图形.声音.视频等信息,如果要在计算机中处理的话,就必须将它们转 ...
- 北京Uber优步司机奖励政策(3月28日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- ROS(一)Topic 通信
ROS系统起源于2007年斯坦福大学人工智能实验室的项目与机器人技术公司Willow Garage的个人机器人项目(Personal Robots Program)之间的合作,2008年之后就由Wil ...