点击Add More按钮页面会自动添加一个输入框和Remove按钮，点击Remove按钮则此行元素将被移除。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <style type="text/css">

    fieldset{width:400px; border-radius:10px;}

    ul{padding: 2px;list-style:none;}

    label{float:left;width:100px}

    </style>

    <script type="text/javascript" src="../../js/jquery.js"></script>

    <script type="text/javascript">

    $(function(){

        $('#add').click(function(){

        　　var str='<li>';

        　　str+='<label>Name</label><input type="text" value=""/>';

        　　str+='<input type="button" value="Remove" class="remove"/></li>';

        　　$('#sites').append(str);

        });

        $('.remove').live('click',function(){

        　　$(this).parent('li').remove();   

        });

    });

    </script>

</head>

<body>

    <form>

    <fieldset>

        <legend>Websites you visit daily</legend>

        <ul id="sites">

        <li><label>Name</label><input type="text" value=""/></li>

        </ul>

        <input type="button" id="add" value="Add More"/>

    </fieldset>

    </form>

</body>

</html>

append与remove的简单使用的更多相关文章

  1. jquery 清空动态append添加元素,remove方法

    <html> <head> <script type="text/javascript" src="jquery-1.9.1.js" ...

  2. jQuery—一些常见方法（2）DOM操作【insertBefore(),insertAfter(),appendTo(),prependTo(),before(),after(),append(),prepend(),remove(),on(),off(),scrollTop()】

    一.insertBefore() 如下代码:找到span标签,将span标签剪切到div的前面 <!DOCTYPE html> <html lang="en"&g ...

  3. Python可迭代对象中的添加和删除（add，append,pop,remove,insert）

    list: classmates = ['Michael', 'Bob', 'Tracy'] classmates.append('Adam') //添加在末尾,没有add()方法 classmate ...

  4. Asp.Net MVC+BootStrap+EF6.0实现简单的用户角色权限管理10

    今天把用户的菜单显示和页面的按钮显示都做好了,下面先来个效果图 接下来说下我实现的方法: 首先我在每个方法前面都加了这个属性, /// <summary> /// 表示当前Action请求 ...

  5. jQuery系列 第一章 jQuery框架简单介绍

    第一章 jQuery框架简单介绍 1.1 jQuery简介 jQuery是一款优秀的javaScript库(框架),该框架凭借简洁的语法和跨平台的兼容性,极大的简化了开发人员对HTML文档,DOM,事 ...

  6. ASP.NET开发常用简单实用的方法

    ASP.NET开发简单实用的方法 一.打印和导出 打印和导出EXCEL在目前ASP.NET开发中可以说是必要的,有时候针对不同数据难易程度下,用有效快速的方法是解决办法的有效途径之一. 1.打印 后台 ...

  7. iOS实现白板、画板功能，有趣的涂鸦工具，已封装，简单快捷使用

    一.效果图: 二.选择颜色: 分[固定颜色模式]和[自由取模式].  三.操作栏功能: 1.撤销:撤销上一步操作,可一直往上进行,直到全部清空. 2.清空:直接清除所有绘画. 3.橡皮擦:去除不要的绘 ...

  8. 比较jquery中的after(),append(),appendTo()方法

    html页面: <p id="myp1">我的兴趣爱好是:</p> <button id="b1">after函数</ ...

  9. 简单看看jdk7源码之java.lang包01

    从今天开始简单开始读一遍jdk的源码,估计这个时间会很长,慢慢啃吧....(首先说一句抱歉,因为很多图都是直接百度扣的,图太多了不能为每一个图附上原版链接,不好意思!) 在网上看了很多的教程,读源码有 ...

随机推荐

  1. 使用Mono Runtime Bundle制作安装包让C#桌面应用程序脱离net framework

    在Xamain 未被收购之前,这货monodroid.exe  就是一个打包的绑定...无奈 配置环境复杂,未能实现 ...有mono运行时就行了..不折腾了 玛德 让C#程序独立运行(脱离 .NET ...

  2. [Operationg System Labs] 我对 Linux0.00 中 boot.s的理解和注释

    (如有错误请立即指正,么么哒!) !    boot.s!! It then loads the system at 0x10000, using BIOS interrupts. Thereafte ...

  3. jsp中pageEncoding、charset=UTF -8

    jsp中pageEncoding.charset=UTF -8" 在JSP/Servlet  中主要有以下几个地方可以设置编码,pageEncoding="UTF-8". ...

  4. You should rebuild using libgmp >= 5 to avoid timing attack vulnerability.", PowmInsecureWarning

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAApcAAAB3CAIAAADZ1fxtAAAbFElEQVR4nO2dzbHDOo6FHY9S0WqqZt

  5. hdu 4605-Magic Ball Game（树状数组）

    题目大意: 给你一棵二叉树,每个节点有一个w值,现在有一颗小球,值为x,从根节点往下掉,如果w==x,那么它就会停止:如果w>x,那么它往左.右儿子的概率都是1.2:如果w<x,那么它往左 ...

  6. firefox关于about:config的常用配置

    about:config是火狐的设置页面,火狐提供了不少高级设置选项在这里以便让你可以更加详细地控制火狐的运行方式.(官方不推荐用户手工修改about:config的设置.所以,如果你对于你想修改的内 ...

  7. datagrid的基本操作-增删改

    1 ---恢复内容开始--- <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  8. myFocus焦点图插件

    注意 1.焦点图初始化ID和图片最外层ID保持一致 2.图片列表外面必须包裹一个div,且id必须为pic http://demo.jb51.net/js/myfocus/tutorials.html ...

  9. iOS开发中的MVC设计模式

    我们今天谈谈cocoa程序设计中的 模型-视图-控制器(MVC)范型.我们将从两大方面来讨论MVC: 什么是MVC? M.V.C之间的交流方式是什么样子的? 理解了MVC的概念,对cocoa程序开发是 ...

  10. progit-zh（Git中文文档）

    发现好像在墙外,还是下载下来看会快点 链接: http://pan.baidu.com/s/1o8EiDMq 密码: vzf9