บทความในวันนี้เป็นการประยุกต์ใช้คำสั่ง .append()
สมมติว่าว่าผมมีโครงสร้างตารางอย่างนี้
<table id="tbl-product">
<tr>
<th>#</th>
<th>product</th>
</tr>
<tr>
<td>1</td>
<td>cat</td>
</tr>
</table>
<p><input type="button" name="add-row" id="add-row" value="เพิ่มแถว" /></p>
ใส่ id ให้ตารางด้วย จะได้อ้างถึงใน jQuery ง่ายๆหน่อย เมื่อคลิกปุ่ม เพิ่มแถว ก็ให้เพิ่มแถวใหม่เข้าไปในตาราง
โค้ดเขียนง่ายๆอย่างนี้
<script type="text/javascript">
$(document).ready(function(){
$('#add-row').click(function(){
var tr = $('<tr></tr>');
var td1 = $('<td>#</td>');
var td2 = $('<td>mouse</td>');
tr.append(td1);
tr.append(td2);
$('#tbl-product').append(tr);
});
})
</script>บทความน่าสนใจ
มี 2 ความเห็น ในบทความเรื่อง “jQuery เพิ่มแถวเข้าไปในตาราง”
แสดงความเห็น
Categories
-
Recent Posts
- เครื่องฟ้อง error จอฟ้า STOP: c0000221 {Bad Image Checksum}
- The application failed to initialize properly(000000)
- อยากเปิดร้านคอม ทำยังไงดี?
- Wordpress Theme PhotoMadness ธีมสำหรับคนชอบถ่ายภาพ
- mail server : ติดตั้ง argosoft mail server
- mail server สร้างเมล์เซิฟเวอร์ทดสอบโค้ดส่งอีเมล์ ด้วย hmailserver
- php redirect สั่งเด้งฟ้าผ่า
- javascript ห้ามคลิกขวา
- CSS IE Bugs แมลงร้ายในไออี 6
- PHP round ปัดเศษ
- PHP ceil() ปัดเศษขึ้น
- Gravatar สร้างร่างใหม่สู่โลกออนไลน์
- PHP floor() ปัดเศษลง
- แจกโค้ด php คำนวณอายุ
- PHP date() ฟังก์ชั่นจัดการวัน-เวลา
Tags
Array Back to the basic calendar CAPTCHA chart CSS Dreamveawer error firefox firefox plugin FPDF General gmail google hotmail html icon icons javascript jQuery jquery plugin jquery slide jquery tooltip jQuery tutorial jQuery UI loop Mac MySQL Other PHP plugin program programming slide slide show SMF smf themes smf themes download smf themes free smf themes thai SQL sql function tooltip Wordpress wordpress plugin
ขอบคุณครับ
ถ้าเราจะเพิ่มทั้งแถวทั้งคอลัมน์ด้วยละค่ะ เป็น 5คอลัมน์ 2แถว