[JQuery] JÄõ¸® ÀÌ¿ëÇؼ ¼Ó¼º °ª º¯°æÇϱâ, ¿¤¸®¸ÕÆ® ¼¿·º¼Ç, À̺¥Æ® Ãß°¡Çϱâ
attrÀ» »ç¿ëÇÏ¸é µË´Ï´Ù. ÀÌÀü¿¡ ÀÛ¼ºÇÑ ÅÇ ¸¸µé±â ±Û¿¡¼ a ¿¤¸®¸ÕÆ®ÀÇ onclick ¼Ó¼ºÀ» »ç¿ëÇÏ¿©, ÀÚ¹Ù½ºÅ©¸³Æ® ÇÔ¼ö¸¦ È£ÃâÇß¾ú´Âµ¥, JÄõ¸®¸¦ ÀÌ¿ëÇؼ ±×·± ºÎºÐÀ» ¿ÏÀüÈ÷ ÀÚ¹Ù½ºÅ©¸³Æ® ÂÊÀ¸·Î ¶¼¾î ³¾ ¼ö ÀÖ°Ô µÇ¾ú½À´Ï´Ù.
$(document).ready(function() {
$("#topnav a").bind("click", function () {
var id = $(this).parents("li").attr("id");
$("body").attr("class", id);
});
});
ÀÌ °£´ÜÇÑ Äڵ忡 À§ Á¦¸ñ¿¡¼ ¾ð±ÞÇÑ ¸ðµç °ÍµéÀÌ µé¾îÀÖ½À´Ï´Ù. ¸ÕÀú, À̺¥Æ® µî·ÏÀ» html¿¡¼ ¿ÏÀüÈ÷ ºÐ¸®ÇÒ ¼ö ÀÖ°Ô µµ¿ÍÁÖ´Â ÄÚµå´Â ¹Ù·Î..
$(document).ready(function() {
});
ÀÌ ³à¼®ÀÔ´Ï´Ù. ÀÌ ¾È¿¡¼ À̺¥Æ® µî·Ï ÀÛ¾÷À» ÇØÁÖ¸é,
<a href="#" onclick="changeMenu('report');">
HTML¿¡¼ ÀÌ·± Äڵ带 ÀÛ¼ºÇÏÁö ¾Ê¾Æµµ µË´Ï´Ù.
´ÙÀ½Àº À̺¥Æ®¸¦ µî·ÏÇÏ´Â ÄÚµåÀÔ´Ï´Ù.
$("#topnav a").bind("click", function () {
});
±× Àü¿¡ ¼¿·º¼ÇÀ» º¸°Ú´Âµ¥, #topnav a ÀÌ ºÎºÐÀº topnav id¸¦ °¡Áø ¿¤¸®¸ÕÆ® ÇÏÀ§ÀÇ a ¿¤¸®¸ÕÆ®¸¦ ¸ðµÎ ¼±ÅÃÇ϶ó´Â °ÍÀÔ´Ï´Ù. API¸¦ º¸¸é ´õ ´Ù¾çÇÑ ¹æ¹ýµéÀÌ ¿¹Á¦¿Í ÇÔ²² Àß ³ª¿ÍÀÖ½À´Ï´Ù.
´Ù½Ã À̺¥Æ® ÄÚµå·Î µ¹¾Æ°¡¼ bind´Â ƯÁ¤ À̺¥Æ®¿¡ ¾î¶°ÇÑ ÇÔ¼ö¸¦ È£ÃâÇϵµ·Ï µî·ÏÇÏ´Â ÇÔ¼öÀε¥, ÀÌ°ÍÀ» ƯÁ¤ À̺¥Æ®¿¡ ¸Â°Ô ÁÙ¿©¼ ´ÙÀ½°ú °°ÀÌ ¾µ ¼öµµ ÀÖ½À´Ï´Ù.
$("#topnav a").click(function () {
});
°£´ÜÇÏÁÒ. clickÀº Ŭ¸¯Ç϶ó´Â°Ô ¾Æ´Ï¶ó click À̺¥Æ® Çڵ鷯¸¦ µî·ÏÇÏ´Â °Ì´Ï´Ù.
var id = $(this).parents("li").attr("id");
ÀÌ Äڵ忡¼´Â parents¸¦ »ç¿ëÇؼ ÀÚ½ÅÀ» °¨½Î°í ÀÖ´Â(¿©±â¼ ÀÚ½ÅÀº »ç¿ëÀÚ°¡ Ŭ¸¯ÇÑ a ¿¤¸®¸ÕÆ®°ÚÁÒ.) ¿¤¸®¸Ó¸ÕÆ® Áß¿¡ li¸¦ ¼±ÅÃÇÏ°í, ±× ¿¤¸®¸ÕÆ®ÀÇ id ¼Ó¼º °ªÀ» °¡Á®¿É´Ï´Ù.
attr(¼Ó¼ºÀ̸§)Àº º¸½Ã´Ù½ÃÇÇ ¼Ó¼ºÀÇ °ªÀ» °¡Á®¿À´Â °ÔÅÍ¿Í ºñ½ÁÇÕ´Ï´Ù.
ÀÌ¿Í ¹Ý´ë·Î ¼¼ÅÍ ¿ªÇÒÀ» ÇÏ´Â ÇÔ¼öµµ ¿ª½Ã attrÀε¥ »ç¿ë¹ýÀÌ Á¶±Ý ´Ù¸¨´Ï´Ù. À̹ø¿¡´Â ÀÎÀÚ¸¦ Çϳª ´õ ÁÝ´Ï´Ù.
$("body").attr("class", id);
ÀÌ·¸°Ô, attr(¼Ó¼ºÀ̸§, °ª) ÇüÅ·Π»ç¿ëÇÏ¸é ¼¼ÅÍ°°ÀÌ µ¿ÀÛÇÕ´Ï´Ù. Âü~~ Æí¸®Çϱº¿ä.
ps: ¿ø·¡´Â bodyÀÇ class°¡ ¾Æ´Ï¶ó id¸¦ º¯°æÇϵµ·Ï Äڵ带 ÀÛ¼ºÇß¾ú´Âµ¥, Àß µÇÁö ¾Ê¾Æ¼ class¸¦ ÀÌ¿ëÇغôµ¥ Àß µ¿ÀÛÇϳ׿ä. ¿Ö ±×·±Áö´Â ¸ð¸£°Ú½À´Ï´Ù. $(document).ready(function(){}); ÀÌ °ÍÀ» »ç¿ëÇÏÁö ¾ÊÀ¸¸é id º¯°æµµ Àß µÇ´Âµ¥ ¸»ÀÌÁÒ.. Àú°Í°ú °ü·ÃÀÌ ÀÖ¾î º¸ÀÔ´Ï´Ù.
Ãâó: http://uip80.tistory.com/entry/JQuery-JÄõ¸®-ÀÌ¿ëÇؼ-¼Ó¼º-°ª-º¯°æÇϱâ-¿¤¸®¸ÕÆ®-¼¿·º¼Ç-À̺¥Æ®-Ãß°¡Çϱâ?category=317570 [¿©¸íÀÇÁý]