suchen

Heim >Web-Frontend >js-Tutorial >jQuery implementiert das Hinzufügen von Daten zur ersten Zeile der list_jquery

jQuery implementiert das Hinzufügen von Daten zur ersten Zeile der list_jquery

WBOY
WBOYOriginal
2016-05-16 15:58:201816Durchsuche

In jQuery können Sie Daten am Ende der Liste durch Anhängen hinzufügen, oder Sie können Daten am Anfang der Liste durch Voranstellen hinzufügen

Die Methode ist ganz einfach:

Code kopieren Der Code lautet wie folgt:

jQuery('#comment_list').prepend('25edfb22a4f469ecb59f1190150159c6hello www.jb51.netbed06894275b65c1ab86501b08a632eb');

Anbei ist auch der JQuery-Code zum kontinuierlichen Hinzufügen von Daten zum Textfeld textarea. 

<%@ 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>

Die oben implementierten Funktionen: Klicken Sie, um zum Textbereich hinzuzufügen, klicken Sie auf -, um - zum Textbereich hinzuzufügen;

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Detaillierte Erläuterung der Verwendung des JQuery-Upload-Plug-Ins Uploadify in AspNet_jqueryNächster Artikel：Detaillierte Erläuterung der Verwendung des JQuery-Upload-Plug-Ins Uploadify in AspNet_jquery

In Verbindung stehende Artikel

Mehr sehen