jquery設置div,文本框 表單的值示例


我們將使用前一章中的三個相同的方法來設置內容:

text() - 設置或返回所選元素的文本內容
html() - 設置或返回所選元素的內容(包括 HTML標記)
val() - 設置或返回表單字段的值


1、html()方法

該方法類似於js當中的innerHTML屬性

$("#two").html()方法 獲取html

$("#two").html("<span>你好!</span>")

2、text()

類似於JS中的innerText屬性

$("div").text()                            //獲取div的文本內容

$("div").text("你好!");               //設置div的文本內容。

3、val()

類似於JS中的value屬性

$("input[type=text]").val()        //獲取input的值

$("input[type=text]").val()       //設置input的值。

vla()方法還有另外一個用處,就是它能使select 、checkbox、和radio 相應的選項被選中。

$(":radio").val("選擇2號")設置ID號為single的單選框的選中值為“選擇2號”

$(":checkbox").val("check2,check3") 設置多個選項.


下面的例子演示如何通過 text()、html() 以及 val() 方法來設置內容:

實例

 代碼如下 復制代碼
$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
$("#test3").val("Dolly Duck");
});
 

text()、html() 以及 val() 的回調函數

上面的三個 jQuery 方法:text()、html() 以及 val(),同樣擁有回調函數。回調函數由兩個參數:被選元素列表中當前元素的下標,以及原始(舊的)值。然后以函數新值返回您希望使用的字符串。

下面的例子演示帶有回調函數的 text() 和 html():

實例

 代碼如下 復制代碼

$("#btn1").click(function(){
$("#test1").text(function(i,origText){
return "Old text: " + origText + " New text: Hello world!
(index: " + i + ")";
});
});

$("#btn2").click(function(){
$("#test2").html(function(i,origText){
return "Old html: " + origText + " New html: Hello <b>world!</b>
(index: " + i + ")";
});
});
 

更多詳細內容請查看:http://www.111cn.net/wy/jquery/56679.htm


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM