Home > Web Front-end > JS Tutorial > jQuery implements adding data to the first row of the list_jquery

jQuery implements adding data to the first row of the list_jquery

WBOY
Release: 2016-05-16 15:58:20
Original
1828 people have browsed it

In jQuery, you can add data at the end of the list through append, or you can add data at the front of the list through prepend

The method is very simple:

Copy code The code is as follows:

jQuery('#comment_list').prepend('
  • hello www.jb51.net
  • ');

    Attached is also the jquery code to continuously add data to the textarea text field.

    <%@ 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>
    
    Copy after login

    The functions implemented above: click to add to the textarea, click - to add - to the textarea;

    The above is the entire content of this article, I hope you all like it.

    Related labels:
    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template