event.target - Events , jQuery |
event.target() เป็นการใช้ jQuery Event กับ event.target() องค์ประกอบที่ใช้ DOM ที่ริเริ่มเหตุการณ์
Syntax
Example 1 ตัวอย่างการใช้งาน Event ของ jQuery event.target()
Eventseventtarget1.html
01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<style>
05. span, strong, p {
06. padding: 8px; display: block; border: 1px solid #999; }
07.</style>
08.<script type="text/javascript" src="jquery-1.6.4.js"></script>
09.<script type="text/javascript">
10. $(document).ready(function(){
11.
12. $("body").click(function(event) {
13. $("#log").html("clicked: " + event.target.nodeName);
14. });
15.
16. });
17.</script>
18.</head>
19.<body>
20.
21. <div id="log"></div>
22. <div>
23. <p>
24. <strong><span>click</span></strong>
25. </p>
26. </div>
27.
28.</body>
29.</html>
Screenshot
คำอธิบาย (ภาษาไทย)
จากตัวอย่างเป็นการใช้ jQuery Event กับ event.target() ในการจัดการกับ element ที่อ้างถึง
Example 2 ตัวอย่างการใช้งาน Event ของ jQuery event.target()
Eventseventtarget2.html
01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<script type="text/javascript" src="jquery-1.6.4.js"></script>
05.<script type="text/javascript">
06. $(document).ready(function(){
07.
08. function handler(event) {
09. var $target = $(event.target);
10. if( $target.is("li") ) {
11. $target.children().toggle();
12. }
13. }
14. $("ul").click(handler).find("ul").hide();
15.
16. });
17.</script>
18.</head>
19.<body>
20.
21.<ul>
22. <li>item 1
23. <ul>
24. <li>sub item 1-a</li>
25. <li>sub item 1-b</li>
26. </ul>
27. </li>
28. <li>item 2
29. <ul>
30. <li>sub item 2-a</li>
31. <li>sub item 2-b</li>
32. </ul>
33. </li>
34.</ul>
35.</body>
36.</html>
Screenshot
คำอธิบาย (ภาษาไทย)
จากตัวอย่างเป็นการใช้ jQuery Event กับ event.target() ในการจัดการกับ element ที่อ้างถึง
ลิ้งค์ที่ควรศึกษา
Go to : jQuery Selectors : jQuery Selectors and Element
Go to : jQuery Events : jQuery and Events
เกี่ยวกับบทความ
ส่วนหนึ่งของบทความได้เรียบเรียงและแปลจากเว็บไซต์ jQuery.Com โค้ดตัวอย่างคำสั่งนี้อยู่ภายใต้สัญญาอนุญาตของ GFDL สามารถนำโค้ดและคำสั่งใช้งานได้ฟรี สงวนลิขสิทธิ์เฉพาะคำอธิบายภาษาไทย
|
 ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท
|
|
| |
By : |
ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ) |
| |
Score Rating : |
 |
|
| |
Create/Update Date : |
2011-09-22 21:33:05 /
2017-03-19 14:00:28 |
| |
Download : |
No files |
|
|
Sponsored Links / Related |
|
|
|
|
|
|
|
