jquery 怎么獲取文本框輸入的值

這個(gè)問題包含兩個(gè)方面：jquery選擇器（即針對(duì)你指定的那個(gè)input元素）和獲取內(nèi)容（即獲得輸入的值），所以綜合起來有如下代碼可以實(shí)現(xiàn)

創(chuàng)新互聯(lián)建站是一家從事企業(yè)網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作、行業(yè)門戶網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)制作的專業(yè)網(wǎng)站建設(shè)公司，擁有經(jīng)驗(yàn)豐富的網(wǎng)站建設(shè)工程師和網(wǎng)頁(yè)設(shè)計(jì)人員，具備各種規(guī)模與類型網(wǎng)站建設(shè)的實(shí)力，在網(wǎng)站建設(shè)領(lǐng)域樹立了自己獨(dú)特的設(shè)計(jì)風(fēng)格。自公司成立以來曾獨(dú)立設(shè)計(jì)制作的站點(diǎn)上千多家。

$("input#test").val(); // 推薦這種方式，因?yàn)閕d是唯一的

$("input[name='test']").val(); // 此時(shí)需要注意是否有同名的input元素

$("input:text").val(); // 這種方式只有整個(gè)網(wǎng)頁(yè)只有一個(gè)文本輸入框才是正確的

下面給出示例：

創(chuàng)建一個(gè)文本框和一個(gè)觸發(fā)獲取文本框輸入內(nèi)容的按鈕

input id="test" name="test" type="text"/br

input type="button" value="顯示文本框輸入內(nèi)容"

簡(jiǎn)單設(shè)置一下css樣式

input[type='text']{width:200px;height:35px;margin:10px;border:1px dashed green; border-radius:5px;}

input[type='button']{width:200px;height:35px;margin:10px;border:2px solid #ebbcbe;}

添加jquery代碼

$(function(){

$("input:button").click(function() {

alert($("input#test").val());

});

})

怎樣用jquery獲取文本框中文本內(nèi)容

獲取name為test的input文本框中的內(nèi)容的jQuery代碼為：

$("input:text[name='test']").val()；

jQuery提供了三個(gè)簡(jiǎn)單實(shí)用的用于獲取元素內(nèi)容的方法：

text() —— 設(shè)置或返回所選元素的文本內(nèi)容

html() —— 設(shè)置或返回所選元素的內(nèi)容（包括 HTML 標(biāo)記）

val() —— 設(shè)置或返回表單字段的值

因?yàn)閕nput屬于表單元素，所以獲取其內(nèi)容使用的是val()方法。

怎樣使用 jquery 清空文本框的內(nèi)容

可以使用 jQuery 設(shè)置內(nèi)容的val()方法來實(shí)現(xiàn)，設(shè)置內(nèi)容為空即達(dá)到清空文本框內(nèi)容的目的：

1

$("input[name='test']").val("").focus(); // 將name=test的文本框清空并獲得焦點(diǎn)，以便重新輸入

示例代碼如下

創(chuàng)建Html元素

div class="box"

span點(diǎn)擊按鈕后清除文本框內(nèi)容：/span

div class="content"

input type="text" name="test" value="這是默認(rèn)的內(nèi)容"

/div

input type="button" class="btn" value="清除文本框內(nèi)容"

/div

設(shè)置css樣式

div.box{width:300px;height:250px;padding:10px 20px;margin:20px;border:4px dashed #ccc;}

div.boxspan{color:#999;font-style:italic;}

div.content{width:250px;height:100px;margin:10px 0;padding:5px 20px;border:2px solid #ff6666;}

input[type='text']{width:200px;height:30px;border:none;}

input[type='button']{width:120px;height:30px;margin:10px;border:2px solid #ebbcbe;}

編寫jquery代碼

$(function(){

$("input:button").click(function() {

$("input[name='test']").val("").focus(); // 清空并獲得焦點(diǎn)

});

})

jquery如何實(shí)現(xiàn)文本框輸入內(nèi)容？

這段jquery代碼可以保持一個(gè)文本框輸入的同時(shí)另外一個(gè)文本框與之同步：

var $inputs = $(".example-input");======$inputs.keyup(function(============{$inputs.val($(this).val());});

jQuery是一個(gè)快速、簡(jiǎn)潔的JavaScript框架，是繼Prototype之后又一個(gè)優(yōu)秀的JavaScript代碼庫(kù)（或JavaScript框架）。jQuery設(shè)計(jì)的宗旨是“write Less，Do More”，即倡導(dǎo)寫更少的代碼，做更多的事情。它封裝JavaScript常用的功能代碼，提供一種簡(jiǎn)便的JavaScript設(shè)計(jì)模式，優(yōu)化HTML文檔操作、事件處理、動(dòng)畫設(shè)計(jì)和Ajax交互。

jQuery的核心特性可以總結(jié)為：具有獨(dú)特的鏈?zhǔn)秸Z(yǔ)法和短小清晰的多功能接口；具有高效靈活的css選擇器，并且可對(duì)CSS選擇器進(jìn)行擴(kuò)展；擁有便捷的插件擴(kuò)展機(jī)制和豐富的插件。jQuery兼容各種主流瀏覽器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。