jQuery怎么得到text文本框的值？

jquery設(shè)置內(nèi)容 - text()、html() 以及 val()

成都創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),南寧企業(yè)網(wǎng)站建設(shè),南寧品牌網(wǎng)站建設(shè),網(wǎng)站定制,南寧網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷(xiāo),網(wǎng)絡(luò)優(yōu)化,南寧網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力。可充分滿(mǎn)足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專(zhuān)業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶(hù)成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

我們將使用前一章中的三個(gè)相同的方法來(lái)設(shè)置內(nèi)容：

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

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

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

下面的例子演示如何通過(guò) text()、html() 以及 val() 方法來(lái)設(shè)置內(nèi)容：

text()、html() 以及 val() 的回調(diào)函數(shù)

上面的三個(gè) jQuery 方法：text()、html() 以及 val()，同樣擁有回調(diào)函數(shù)?；卣{(diào)函數(shù)由兩個(gè)參數(shù)：被選元素列表中當(dāng)前元素的下標(biāo)，以及原始（舊的）值。然后以函數(shù)新值返回您希望使用的字符串。

下面的例子演示帶有回調(diào)函數(shù)的 text() 和 html()：

[JQuery]怎樣獲取和修改文本框的值：

文本框是指

表單中type 為text ，或者是hidden的標(biāo)簽。例如：[html]?view plain?copy

文本框:

input?type="text"?value="text文本框"?name="username"?id="username"/br/

獲取文本：

$("#username").val()

"text文本框"

或者

$("#username").attr("value")

"orangleliu"

設(shè)置文本：

$("#username").val("orangleliu")

如何用jquery實(shí)現(xiàn)全選text里的文字

下面的jquery代碼可以實(shí)現(xiàn)點(diǎn)擊文本框即全選其文字的效果：

$("input:text").click(function(){?

$(this).select();

});

示例代碼如下

創(chuàng)建Html元素

div?class="box"

span單擊文本框全選文字：/spanbr

div?class="content"

input?type="text"?value="單擊即可全選文字"

/div

/div

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

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

div.box?span{color:#999;font-style:italic;}

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

input[type='text']{width:200px;height:35px;padding:5px?10px;border:1px?solid?#ff9966;}

編寫(xiě)jquery代碼

$(function(){

$(":text").click(function()?{

$(this).select();

})

})

觀(guān)察效果

初始狀態(tài)

點(diǎn)擊文本框之后

jquery 獲取text值

首先，html屬性中有兩個(gè)方法，一個(gè)有參，一個(gè)無(wú)參

1. 無(wú)參html（）：取得第一個(gè)匹配元素的html內(nèi)容。這個(gè)函數(shù)不能用于XML文檔。但可以用于XHTML文檔，返回的是一個(gè)String

例子：

html頁(yè)面代碼：divpHello/p/div

jquery代碼：$("div").html();

結(jié)果：Hello

2.有參html（val）：設(shè)置每一個(gè)匹配元素的html內(nèi)容。這個(gè)函數(shù)不能用于XML文檔。但可以用于XHTML文檔。返回一個(gè)jquery對(duì)象

html頁(yè)面代碼：div/div

jquery代碼：$("div").html("pNice to meet you/p");

結(jié)果：[ divp Nice to meet you/p/div ]

其次，text屬性中有兩個(gè)方法，一個(gè)有參，一個(gè)無(wú)參

1. 無(wú)參text（）：取得所有匹配元素的內(nèi)容。結(jié)果是由所有匹配元素包含的文本內(nèi)容組合起來(lái)的文本。返回的是一個(gè)String

例子：

html頁(yè)面代碼：pbHello/b fine/p

pThank you!/p

jquery代碼：$("p").text();

結(jié)果：HellofineThankyou!

2.有參text（val）：設(shè)置所有匹配元素的文本內(nèi)容, 與 html() 類(lèi)似, 但將編碼 HTML (將 "" 和 "" 替換成相應(yīng)的HTML實(shí)體).返回一個(gè)jquery對(duì)象

html頁(yè)面代碼：pTest Paragraph./p

jquery代碼：$("p").text("bSome/b new text.");

結(jié)果:[ pbSome/b new text./p ]

最后，val（）屬性中也有兩個(gè)方法，一個(gè)有參，一個(gè)無(wú)參。

1.無(wú)參val（）：獲得第一個(gè)匹配元素的當(dāng)前值。在 jQuery 1.2 中,可以返回任意元素的值了。包括select。如果多選，將返回一個(gè)數(shù)組，其包含所選的值。

返回的是一個(gè)String、 array

例子：

html頁(yè)面代碼 ：

代碼如下:

p/pbr/

select id="single"

optionSingle/option

optionSingle2/option

/select

select id="multiple" multiple="multiple"

option selected="selected"Multiple/option

optionMultiple2/option

option selected="selected"Multiple3/option

/select

jquery

代碼：$("p").append( "bSingle:/b " + $("#single").val() + "

bMultiple:/b " + $("#multiple").val().join(", "));

結(jié)果:[ pbSingle:/bSinglebMultiple:/bMultiple, Multiple3/p]

2.有參val（val）：設(shè)置每一個(gè)匹配元素的值。在 jQuery 1.2, 這也可以為check,select,radio元件賦值,返回一個(gè)jquery對(duì)象

html頁(yè)面代碼：

input type="text"/

jquery代碼：$("input").val("hello world!");

結(jié)果：hello world!