jquery实现<body>中点击按钮后,在<tbody>中显示一连串文本框

HTML中的代码如下:

 1 <div   style="background:#fff;border-style:solid; border-width:1px 1px 0 1px;border-color:#B8D0D6;">
 2             <div >
 3               <div style="margin:-6px 0 0 0">
 4                 <button  class="button gray" type="button"id="addButton">添加坐标</button>
 5                 <input type="text" name="dwz_rowNum" class="textInput" id="count"  value="1" >
 6               </div>
 7             </div>
 8             <table class="list nowrap "id="table" width="100%">
 9             <thead>
10               <tr>
11                 <th width="20%"size="18" >ID</th>
12                 <th width="20%"size="18" >X轴坐标</th>
13                 <th width="20%"size="18" >Y轴坐标</th>
14                 <th width="20%"size="18" >备注</th>
15                 <th width="20%"size="18" >操作</th>
16               </tr>
17             </thead>
18
19             <tbody>
20
29             </tbody>
30           </table>
31         </div>

jquery代码如下:

 2 jQuery(function($){
 3    //添加行   5     $("#addButton").click(function(){     9       for(var i=1;i<=$("#count")[0].value;i++){
10         $("#table>tbody").append(‘<tr><td width="20%"><input name="items.order_id[]" type="text"size="20" value=""></input></td><td width="20%"><input name="items.x_coordinates[]" type="text" value=""></input></td><td width="20%"><inputname="items.y_coordinates[]" type="text" value=""></input></td><td width="20%"><input name="items.remark[]" type="text" value=""></input></td><td width="20%"><button class="btnDel"onclick="deltr(this)">删除</button></td></tr>‘)
11       }
12    });
13 });
14 //删除行的函数,必须要放domready函数外面
15 function deltr(delbtn){    17     $(delbtn).parents("tr").remove();
23 };

  

jquery实现<body>中点击按钮后,在<tbody>中显示一连串文本框

时间: 2024-10-14 16:42:48

jquery实现<body>中点击按钮后,在<tbody>中显示一连串文本框的相关文章

Android中点击按钮获取string.xml中内容并弹窗提示

场景 AndroidStudio跑起来第一个App时新手遇到的那些坑: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103797243 效果 注: 博客:https://blog.csdn.net/badao_liumang_qizhi关注公众号霸道的程序猿获取编程相关电子书.教程推送与免费下载. 实现 新建project后,打开布局文件activity_main.xml 添加一个Button <Button android

点击按钮后实现页面跳转

<button onclick="location.href='http://www.baidu.com';">点我跳转</button> 点击按钮后实现页面跳转,码迷,mamicode.com

053点击按钮后改变按钮的文字

效果如下: ViewController.h 1 #import <UIKit/UIKit.h> 2 3 @interface ViewController : UIViewController 4 @property (strong, nonatomic) UIButton *btnState; 5 6 @end ViewController.m 1 #import "ViewController.h" 2 3 @interface ViewController () 4

checkbox点击选中,再点击取消,并显示在文本框中

function checkItem(e,itemId) { var item = document.getElementById(itemId); var $items = $(item); if (e.checked) { var checkval = $items.val(); var str = $("#txtFilePath").val() + checkval; $("#txtFilePath").val(str); } else { var a = &

点击按钮后延迟跳转

<script> function goto(url,dalay) { setTimeout("window.location='"+url+"'",dalay); } </script> <button onclick="goto('http://www.k688.com',3000)">点击按钮3秒后跳转到jzzy</button> 是否可以利用这个功能,简单的在手机上实现点击按钮,看到hove

点击按钮后到底发生了什么,Touch,LongClick或者Click?

按钮点击事件详解 最近一个项目需要给应用初始界面上的动态按钮添加在不同状态的变换效果,如点击(俗一点也可称为按压)后实现背景图的更换或者图标的缩放等效果.由于按钮点击的时间有长有短,所以采用OnTouchListener监听器对点击事件进行监听,并利用对应的onTouch(View v, MotionEvent event)方法来实现按钮图标的变换效果(背景图更换或者图标缩放).但是项目中除了利用Touch事件来处理按钮基本的变换外,还需要响应LongClick或者Click事件来为用户做进一步

如何点击按钮后在加载外部的Js文件

或许有朋友遇到过,想等自己点击按钮之后才执行某一个js文件,那么,你运气好,看到了我的代码了哈哈, <html> <head> <title></title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script> <scri

electron-vue中点击按钮,实现打开程序目录里面的某个文件

设计到的知识点: explorer.exe /select 打开文件夹并把焦点放到指定文件 nodejs中的process模块--child_process.exec 我这里是根据需求,点击按钮后打开本项目里面的数据库 ams.db文件 需要注意的是,开发版本和打包后的项目结构可能会发生改变,当你在开发版本测试的路径成功,而打包后可能不存在这个文件夹 代码结构如下: <Button class="tab-w" type="primary" icon="

jquery 实现 点击按钮后倒计时效果,多用于实现发送手机验证码

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <title></title&