Jquery實(shí)現(xiàn)點(diǎn)擊按鈕,連續(xù)地向textarea中添加值的實(shí)例代碼
代碼如下:
<%@ 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(){ //當(dāng)點(diǎn)擊所有的id中包含'buttonValidate'的input標(biāo)簽時(shí),執(zhí)行函數(shù)
var btnVal=$.trim($(this).val());//trim函數(shù),去掉空格
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>
以上實(shí)現(xiàn)的功能:點(diǎn)擊+,則把+添加到textarea中,點(diǎn)擊-,則把-添加到textarea中;
如圖:
- jquery清空textarea等輸入框?qū)崿F(xiàn)代碼
- jQuery textarea的長度進(jìn)行驗(yàn)證
- JQuery為textarea添加maxlength屬性的代碼
- jquery實(shí)現(xiàn)textarea輸入框限制字?jǐn)?shù)的方法
- textarea中的手動(dòng)換行處理的jquery代碼
- 使用jquery給input和textarea設(shè)定ie中的focus
- jQuery替換textarea中換行的方法
- TextArea不支持maxlength的解決辦法(jquery)
- 基于jquery的textarea發(fā)布框限制文字字?jǐn)?shù)輸入(添加中文識(shí)別)
- jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法
相關(guān)文章
jquery 學(xué)習(xí)之二 屬性(html()與html(val))
取得第一個(gè)匹配元素的html內(nèi)容。這個(gè)函數(shù)不能用于XML文檔。但可以用于XHTML文檔。2010-11-1115款優(yōu)秀的jQuery導(dǎo)航菜單插件分享
這篇文章收集了15款優(yōu)秀的jQuery導(dǎo)航菜單插件分享給大家。jQuery 是一個(gè)非常優(yōu)秀的 JavaScript 框架,使用簡單靈活,同時(shí)還有許多成熟的插件可供選擇,jQuery 讓網(wǎng)站有更好的可用性和用戶體驗(yàn),給訪問者對(duì)網(wǎng)站留下非常好的印象。2011-07-07ASP.NET jQuery 實(shí)例17 通過使用jQuery validation插件校驗(yàn)ListBox
這節(jié)介紹jQuery validation插件一個(gè)新的校驗(yàn)規(guī)則屬性rangelength,通過數(shù)組方式賦值2012-02-02jQuery實(shí)現(xiàn)的滑塊滑動(dòng)導(dǎo)航效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的滑塊滑動(dòng)導(dǎo)航效果,涉及jQuery事件響應(yīng)及頁面元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-06-06讓人印象深刻的10個(gè)jQuery手風(fēng)琴效果應(yīng)用
jQuery 是最流行的 JavaScript 開發(fā)框架,它簡化了 HTML 文檔遍歷,事件處理,動(dòng)畫以及 Ajax 交互,幫助 Web 開發(fā)人員更快速的實(shí)現(xiàn)各種精美的界面效果2012-05-05jquery實(shí)現(xiàn)簡單的輪換出現(xiàn)效果實(shí)例
這篇文章主要介紹了jquery實(shí)現(xiàn)簡單的輪換出現(xiàn)效果,涉及jquery針對(duì)圖片樣式切換效果的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07jquery tree 可編輯節(jié)點(diǎn)實(shí)現(xiàn)代碼(jquery一句話節(jié)點(diǎn)菜單)
jquery tree 可編輯節(jié)點(diǎn),實(shí)現(xiàn)的三級(jí)菜單實(shí)現(xiàn)代碼,這里我們將為大家準(zhǔn)備了兩個(gè)。一個(gè)是鋒利的jquery中的一句話導(dǎo)航菜單實(shí)現(xiàn)代碼。非常不錯(cuò)。2009-11-11jquery操作select取值賦值與設(shè)置選中實(shí)例
下面小編就為大家?guī)硪黄猨query操作select取值賦值與設(shè)置選中實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02