การใช้ method text(), html()และ val() ใน jQuery
โพสต์แล้ว: 11/01/2018 11:14 am
text () - ตั้งค่าหรือส่งกลับเนื้อหาข้อความขององค์ประกอบที่เลือก
html () - ตั้งค่าหรือส่งกลับเนื้อหาขององค์ประกอบที่เลือก (ตลอดจนรูปแบบของ HTML)
val () - ตั้งค่าหรือส่งคืนค่าของข้อมูลที่อยู่ใน text ฟอร์ม
ตัวอย่าง
ผลลัพธ์เมื่อกดปุ่มเปลี่ยนทั้ง text(), html()และ val()แล้ว
อ้างอิง : https://www.w3schools.com/jquery/jquery_dom_set.asp
https://www.w3schools.com/jquery/tryit. ... m_html_set
html () - ตั้งค่าหรือส่งกลับเนื้อหาขององค์ประกอบที่เลือก (ตลอดจนรูปแบบของ HTML)
val () - ตั้งค่าหรือส่งคืนค่าของข้อมูลที่อยู่ใน text ฟอร์ม
ตัวอย่าง
โค้ด: เลือกทั้งหมด
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!--link button-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!--script button-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("#test1").text("Hello MindPHP!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello MindPHP!</b>");
});
$("#btn3").click(function(){
$("#test3").val("สวัสดี");
});
});
</script>
</head>
<body>
<p id="test1">This is a paragraph.</p>
<p id="test2">This is another paragraph.</p>
<p>เพิ่ม field: <input type="text" id="test3" value="ยินดีต้อนรับ"></p>
<button id="btn1" class="btn btn-info">Set แบบ Text</button>
<button id="btn2" class="btn btn-success">Set แบบ HTML</button>
<button id="btn3" class="btn btn-danger">Set แบบ Value</button>
</body>
</html>- fdr.JPG (17.22 KiB) Viewed 2420 times
https://www.w3schools.com/jquery/tryit. ... m_html_set