jQuery实现在列表的首行添加数据

 　　这篇文章主要介绍了jQuery实现在列表的首行添加数据的方法，十分的简单，有需要的小伙伴可以参考下。

　　jQuery中可以通过append在列表的最后添加数据，也可以通过prepend在列表的最前面添加数据

　　方法很简单：

　　复制代码 代码如下:

　　jQuery('#comment_list').prepend('

  • hello www.jb51.net

');

 

　　另外附上jquery实现连续向textarea文本域添加数据的代码。

　　?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

<%@ page language="java" contenttype="text/html; charset=gbk" pageencoding="gbk"%>
<%@ include file="/pages/common/taglibs.jsp"%>
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input[id^='buttonvalidate']").click(function(){ //当点击所有的id中包含'buttonvalidate'的input标签时，执行函数
var btnval=$.trim($(this).val());//trim函数，去掉空格
var str = $('#textareavalidate').val() + btnval;//
$('#textareavalidate').val(str);//
});
});
</script>
<title>insert title here</title>
</head>
<body>
<form id="form1" name="form1" action="" method="post">
<table id ="table1" class="base_table" cellspacing="0" border="1" style="border-collapse: collapse">
<tr>
<td>
<textarea cols="75" rows="5" id="textareavalidate"></textarea>
</td>
</tr>
<tr id="tr1">
<td>
<input id="buttonvalidate1" type="button" value=" + "/>
<input id="buttonvalidate2" type="button" value=" - "/>
<input id="buttonvalidate3" type="button" value=" * "/>
<input id="buttonvalidate4" type="button" value=" / "/>
<input id="buttonvalidate5" type="button" value=" ! "/>
<input id="buttonvalidate6" type="button" value=" = "/>
<input id="buttonvalidate7" type="button" value=" < "/>
<input id="buttonvalidate8" type="button" value=" > "/>
<input id="buttonvalidate9" type="button" value=" & "/>
<input id="buttonvalidate10" type="button" value=" | "/>
<input id="buttonvalidate11" type="button" value=" ( "/>
<input id="buttonvalidate12" type="button" value=" ) "/>
</td>
</tr>
</table>
</form>
</body>
</html>

　　以上实现的功能：点击+，则把+添加到textarea中，点击-，则把-添加到textarea中;

　　以上所述就是本文的全部内容了，希望大家能够喜欢。

时间： 2024-10-03 08:35:12

jQuery实现在列表的首行添加数据的相关文章

jQuery实现在列表的首行添加数据_jquery

jQuery中可以通过append在列表的最后添加数据,也可以通过prepend在列表的最前面添加数据 方法很简单: 复制代码 代码如下: jQuery('#comment_list').prepend('<li>hello www.jb51.net</li>'); 另外附上jquery实现连续向textarea文本域添加数据的代码. <%@ page language="java" contenttype="text/html; charset

jquery通过select列表选择框对表格数据进行过滤示例_jquery

jquery通过select列表选择框对表格数据进行过滤 表格数据 复制代码 代码如下: <table id="example">    <thead>        <tr>            <th>Name</th>            <th>Surname</th>        </tr>    </thead>    <tbody>       

jQuery实现为LI列表前3行设置样式的方法【2种方法】_jquery

本文实例讲述了jQuery实现为LI列表前3行设置样式的方法.分享给大家供大家参考,具体如下: 在设计网页模板的时候,为了突出信息的重要性以及美观度,我们会设置一些样式使LI文章列表的前3行加上不同的样式,例如给LI文章列表的前3行文字颜色设置红色,再例如图片列表的时候设置列表第一张图片.第二张图片等的宽和高,都可以用蓝叶分享的这两种方法为LI列表设置样式:对于懂PHP语言的设计者来说,很容易就可以实现的效果,对于不懂PHP语言的可以使用这两种方法也很轻松的实现自己想要的各种效果. <!DOCT

jquery bind(click)传参让列表中每行绑定一个事件_jquery

点击列表中某行,弹出详情的需求比较常见.用jquey bind 点击事件时,传参不注意可能会导致点击每一行都是显示相同内容的情况,这大多数是因为传参没注意引起的问题.简易代码如下: for(var i=0;i<2;i++) { $("#b" + i).bind("click", {'bindText':bindText + i}, function(e){ butClick(e); }); } 测试代码: <html> <head> &

JQuery实现表格动态增加行并对新行添加事件_jquery

实现功能: 通常在编辑表格时表格的行数是不确定的,如果一次增加太多行可能导致页面内容太多,反应变慢:通过此程序实现表格动态增加行,一直保持最下面有多个空白行. 效果: 一:原始页面 二:表1增加新行并绑定timepicker 三:表2自动增加行,新行绑定timepicker HTML源码: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-

WORD首行缩进、悬挂缩进的快捷键列表

  以下内容与WORD首行缩进.悬挂缩进相关,通过快捷键,可以提高我们操作文档的效率. ①WORD首行缩进的快捷键 Ctrl+M ②WORD悬挂缩进的快捷键 Ctrl+T ③同时实现悬挂缩进和首行缩进的快捷键 Ctrl+M ④与此相关的其它快捷键 Ctrl+Shift+M:同时减少首行和悬挂缩进. Ctrl+T:增加首行缩进. Ctrl+Shift+T:减少首行缩进.

WPS文字教程：让新文档首行自动缩进

有网友反应,在用WPS文字处理文档时,希望能够一打开程序,就应用了首行缩进,免得每次制作文档都要重复设置.其实要实现这一点并不难,只需要一点点时间和一点点技巧. 第一步,启动WPS文字,系统会自动生成一个新的空白文档,用鼠标点一下"格式"工具条最左侧的"格式窗格"按钮 ,在程序界面的右侧任务窗格中就会显示"样式和格式".在样式列表中找到"正文",点击其右侧的下拉菜单,从菜单列表中选择"修改"(图1). 图1

用css控制html中首行空两格

 利用css 来进行首行缩进,非常的方便. 将文章内容用p标签包住,然后对<p>标签添加样式即可 实例: <div class="context"><p>第一段</p><p> 第二段</p></div> 那么我们就在css里添加样式 .context p{     text-align: justify; text-justify: inter-ideograph; text-indent: 2em;

jQuery使用prepend()方法在元素前添加内容用法实例

 这篇文章主要介绍了jQuery使用prepend()方法在元素前添加内容的方法,实例分析了prepend方法追加内容的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了jQuery使用prepend()方法在元素前添加内容的用法.分享给大家供大家参考.具体分析如下: 下面的代码可实现在文本前和列表前添加新的元素 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!