<html>
<head>
<title>html/css/js学习小结</title>
<script src="jquery-1.8.3.js"></script>
<style type="text/css">
/*span {
display:inline;
width:16%;
}*/
li {
display:table-cell;
width:0.5%;
margin-right:10px; }
ul {
float:left;
display-style:none; }
.line1{
background-color:#999999;
}
.line2{
background-color:#E6E6E6;
}
</style>
</head>
<body >
<div id="body" style="border:1px solid black;width:600px;position:fixed;left:50%;top:30px;margin-left:-250px">
<!--标题栏-->
<div id="body-title" style="width:600px;">
<ul >
<li ><input type="checkbox" id="selectAll"/>全选</li>
<li >id</li>
<li >name</li>
<li >address</li>
<li >isshow</li>
<li >操作</li> </ul>
</div> <!--内容栏-->
<div id="body-content" style="padding-top:0;padding-bottom:0;"> </div>
</div> <script type="text/javascript">
<!--初始化数据--> $(function(){
var ulId = "lin31";
for(var index=0;index< 10;index++){ if(index % 2 == 0){
ulId = "line1";
} else {
ulId = "line2";
} $("#body-content").append("<ul class="+ulId+" id='ul"+index+"'><li><input type='checkbox' id='item' /></li><li >"+index+"</li><li >zhangsan"+index+"</li><li >江苏南京"+index+"</li><li >"+(index%2)+"</li><li ><input type='button' id='edit' value='编辑' class='"+index+"'/><input type='button' id='delete' value='删除' class='"+index+"'/></li></ul>"); }
<!--绑定删除按钮的点击事件-->
$(":input[id='delete']").click(function(){
var id = $(this).attr("class");
$("#ul"+id).remove();
}) <!--绑定全选事件-->
$("#selectAll").bind("click",function(){
var status = $(this).attr("checked"); if (status){
$(":input[id='item']").attr("checked",true);
}else{
$(":input[id='item']").attr("checked",false);
} }) }) </script>
</body> </html>

  

python学习之jquery小练习的更多相关文章

  1. Python学习---基于JQuery的Ajax实现[快捷+底层$.ajax]

    快捷API <1>$.get(url, [data], [callback], [type]) <2>$.post(url, [data], [callback], [type ...

  2. Python学习:8.小项目之登录注册验证

    简介 本次项目登录注册验证是对之前学习知识点的加深学习,这次项目的练习的知识点有函数.判断语句.循环语句.文件操作等. 项目流程 运行代码之后,输出登录或者注册选项. 当选择登录之后,输入用户名密码, ...

  3. Python学习-day17 jQuery method and demo

    一:介绍: jQuery:是DOM和js的封装.jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多).现在大多数的pc端的网站都 ...

  4. 6月6日 python学习总结 jQuery (三)

    1. 常用事件 1. hover #鼠标悬停监听 2. keydown和keyup #键盘按键 按下/抬起 3. change #监听值的改变 全部输入完失去焦点后 4. focus和blur # 获 ...

  5. python学习之----异常处理小示例

    网络是十分复杂的.网页数据格式不友好,网站服务器宕机,目标数据的标签找不到,都 是很麻烦的事情.网络数据采集最痛苦的遭遇之一,就是爬虫运行的时候你洗洗睡了,梦 想着明天一早数据就都会采集好放在数据库里 ...

  6. Python学习2,小程序

    今天主要就是弄懂了一个循环判 for i in [1,2]: for j in [1, 2, 3]: print(i, j) break else: print("for-j") ...

  7. python学习-6 猜拳小游戏

    import random # 调用随机数模块 pc = random.randint(1,3) # 产生1-3的随机数 print("来玩个猜拳游戏吧!") a = '石头' b ...

  8. 6月5日 python学习总结 jQuery (二)

    1. 操作样式     对CSS类的操作: addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名. hasClass();// 判断样式存不存在 ...

  9. 记录Python学习中的几个小问题

    记录Python学习中的几个小问题,和C#\JAVA的习惯都不太一样. 1.Django模板中比较两个值是否相等 错误的做法 <option value="{{group.id}}&q ...

随机推荐

  1. Linux(Debian) vps安装gnome桌面+VNC

      昨天转载了一篇关于在Linux VPS上安装xface桌面并VNC连接的文章,因为文章是基于CentOS系统来操作的,有热心读者希望有一个Debian下的类似的东西,这就促成了今天的这篇文字.需要 ...

  2. mysql --The MEMORY Storage Engine--官方文档

    原文地址:http://dev.mysql.com/doc/refman/5.7/en/memory-storage-engine.html The MEMORY storage engine (fo ...

  3. 115 Java Interview Questions and Answers – The ULTIMATE List--reference

    In this tutorial we will discuss about different types of questions that can be used in a Java inter ...

  4. C#中ROUND函数的问题 解决

    ROUND()是C#中math的一个成员函数.System.Math.Round(),这个函数有四种用法,最长用的是对小数点位数的舍入.但这和现实生活中的“四舍五入”有一定区别,也有别JAVA中Mat ...

  5. Python 字典排序

    思路是把字典转为列表后再排序 d={'z':1,'y':2,'x':3} # 字典 s=d.items() # [('y', 2), ('x', 3), ('z', 1)] 列表 s.sort() # ...

  6. 使用dispatch_group实现并封装分组并发网络请求

    在实际开发中我们通常会遇到这样一种需求:某个页面加载时通过网络请求获得相应的数据,再做某些操作.有时候加载的内容需要通过好几个请求的数据组合而成,比如有两个请求A和B,我们通常为了省事,会将B请求放在 ...

  7. C#中,为什么结构体也可以设置构造函数?

    结构体派生自ValueType,ValueType派生自Object,可访问Object的方法.结构体是一种缩小版的类.结构体不能继承.结构体总是有一个无参数的默认构造函数,不允许替换.结构体可指定字 ...

  8. [改善Java代码]非稳定排序推荐使用List

    我们知道Set与List的最大区别就是Set中的元素不可以重复(这个重复指的equals方法的返回值相等),其他方面则没有太大的区别了,在Set的实现类中有一个比较常用的类需要了解一下:TreeSet ...

  9. Junit,hamcrest和Eclemma安装及使用

    Junit和hamcrest下载及安装 下载地址 Junit      http://download.csdn.net/detail/luzle/6915487 Hamcrest  http://d ...

  10. IIS服务器应用程序不可用的解决办法

    转载:http://www.cnblogs.com/caicainiao/archive/2010/11/29/1891085.html 这个问题见了好几次,在.net下 Microsoft visu ...