当前位置:首页 > jQuery技术文章 > jQuery实现表单动态添加与删除数据操作示例

jQuery实现表单动态添加与删除数据的实例分享

  • 发布时间:
  • 作者:码农之家原创
  • 点击:116

这篇文章主要知识点是关于jQuery、表单、动态添加、动态删除、数据、的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子书

jQuery Mobile从入门到精通
  • 类型:jQuery大小:168.7 MB格式:PDF作者:未来科技
立即下载

jQuery实现表单动态添加与删除数据操作示例

本文实例讲述了jQuery实现表单动态添加与删除数据操作。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>用户名注册</title>
  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  <script>
    $(document).ready(function () {
      $("#button").click(function () {
        var name = $("#yonghu").val();
        var mima = $("#mima").val();
        var youxiang = $("#youxiang").val();
        var tr = "<tr><td>" + '<input type="checkbox">' + "</td><td>" + name + "</td><td>" + mima + "</td><td>" + youxiang + "</td><td>" + '<input type="button" value="删除">' + "</td></tr>";
        $("#table").append(tr);
        $(":button").click(function () {
          $(this).parent().parent().remove();
        });
      });
    });
  </script>
</head>
<body>
用户:<input id="yonghu" type="text">
密码:<input id="mima" type="password">
邮箱:<input id="youxiang" type="text">
<input type="submit" id="button" value="添加">
<table id="table" border="1ps">
  <tr>
    <td><input type="checkbox"></td>
    <td>用户名</td>
    <td>密码</td>
    <td>邮箱</td>
    <td>操作</td>
  </tr>
</table>
</body>
</html>

运行结果:

jQuery实现表单动态添加与删除数据操作示例

希望本文所述对大家jQuery程序设计有所帮助。

以上就是本次给大家分享的关于java的全部知识点内容总结,大家还可以在下方相关文章里找到相关文章进一步学习,感谢大家的阅读和支持。

推荐内容

pLSA的Python实现

PHP如何实现随机数字、字母的验证码的代码

Java中集合关系图及常见操作分享

如何发布一个npm包(基于vue)

如何用Python 判断奇偶数

展开 +

收起 -

jQuery 相关电子书
学习笔记
网友NO.555105

使用jquery动态加载Js文件和Css文件

如果你有很多关联的CSS文件要一起加载,或者想动态的加载不同的CSS文件,那么下面的方法你一定对你有帮助。 Jquery动态加载Js和Css扩展方法 $.extend({ includePath: '', include: function(file) { var files = typeof file == "string" ? [file]:file; for (var i = 0; i files.length; i++) { var name = files[i].replace(/^\s|\s$/g, ""); var att = name.split('.'); var ext = att[att.length - 1].toLowerCase(); var isCSS = ext == "css"; var tag = isCSS ? "link" : "script"; var attr = isCSS ? " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' "; var link = (isCSS ? "href" : "src") + "='" + $.includePath + name + "'"; if ($(tag + "[" + link + "]").length == 0) document.write("" + tag + attr + link + "/" + tag + ""); } } }); 使用方法: $.include('//www.jb51.net/include/dedeajax.js'); $.include('//www.jb51.net/templets/skins/style/android.css'); 或者: $.includePath='www.jb51.net/html/'; $.include([dedeajax.js','an……

网友NO.878377

jQuery动态移除与增加onclick属性的方法详解

本文实例讲述了jQuery动态移除与增加onclick属性的方法。分享给大家供大家参考,具体如下: 这里给大家介绍利用jquery的 removeAttr 与 attr 事件来给a标签增加与删除onclick事件的具体操作方法,有需要了解的朋友可参考。 要实现效果: 点击链接先去掉onclick属性,3秒后再自动加上该标签中的onclick属性 jQuery中,针对标签属性的操作都是使用 attr() 方法来实现的,比如: $("a").attr("onclick") 可获得a标签的 onclick 属性,对应的: 增加事件 $(选择器).attr(属性名) 它的作用就是获取指定元素( $(选择器)部分 )的指定属性的值 如设置onclick属性: $("a").attr("onclick","test();"); 删除事件 $(selector).removeAttr(attribute) 例如 删除onclick属性: $("a").removeAttr("onclick"); 理论上上面的代码没问题,但实际上上面语句不执行也不报错,后来发现原因: jquery 1.6之前的版本并不支持 attr() 方法对……

网友NO.812698

解决jQuery动态获取手机屏幕高和宽的问题

今天帮同事解决了用jQuery获得动态的手机屏幕宽高的问题。 问题的起因是,当同事用了一个需要全屏滚动的图片控件时,需要获得屏幕的高度来设置图片为全屏。但是他用$(window).height()始终无法第一次拿到高,刷新一下后就可以,我尝试了使用window.onload=function(){}来解决,发现依然无法成功。 最后,我认为一定是因为第二次刷新时,浏览器有了缓存,所以就可以拿到了高,那么肯定是页面加载DOM的时间差,导致了这个问题,于是就使用了setTimeout(方法名,500);做了延时500毫秒,结果就正常了。 所以当朋友们无法获得屏幕宽高时,不妨用这个试试……

网友NO.113254

基于jquery打造的百分比动态色彩条插件

以前没写过jquery插件,在开发这个时,写一下代码,又看一下jquery插件的定义(如何开发之类的东东),来来去去的。 之所以要写这个插件,主要是为了往后的项目中方便实现这类型的功能,在之前做问卷调查那个应用中,就用到这个来显示结果,但当时开发时并不用是插件的,一大堆代码,看也烦,用起来很麻烦(当时就调了一个上午)。 还好,这个功能比较简单,正好合适新手写插件。 具体的效果如图: 这个也算是简单的比例图吧。 插件的具体的代码如下: ; (function ($) { $.fn.percentbar = function (o) { var options1 = $.extend({ percent:[],//比例数组,如:[0.5,0.4,0.6] 长度大于1时,按顺序发配比例 bar_bgcolor:'#EFEFEF',//色彩条的背景颜色 bar_bordercolor:'#E2E2E2',//色彩条的边框颜色 bar_borderwidth:1,//色彩条的边框宽度 width:250,//色彩条的宽度 height:14,//色彩条的高度 callb……

<
1
>

电子书 编程教程 文档 软件 源码 视频

Copyright 2018-2020 xz577.com 码农之家

本站所有电子书资源不再提供下载地址,只分享来路

免责声明:网站所有作品均由会员网上搜集共同更新,仅供读者预览及学习交流使用,下载后请24小时内删除

版权投诉 / 书籍推广 / 赞助:QQ:520161757