최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday

티스토리 뷰



   jquery context 라이브러리에서 메뉴 분기처리하여 보이고 추가하고 삭제하기..



실무에서 jquery.context 메뉴의 상태에 따라 메뉴의 내용이 달라져야 하기때문에 아래와 같이 만들어서 사용중.



build 객체 사용하여 안에 items 내용들을 넣고, items_obj 만들어서 추가/삭제가 가능하도록 구성해 보았다..



구체적인 내용은 나중에 정리하겠다... 너무 바쁘다..



<!-- script -->

<script>

/*

item 을 엘리먼트 클래스에 따라서 분기처리함

*/

$(function(){


$.contextMenu({

disabled: "disabled",

hover: 'hover', 

selector: ".contextMenu",

autoHide:true,

animation:{duration: 500, show: "slideDown", hide: "slideUp"},

callback: function(key, options) {

var m = "clicked: " + key;

//window.console && console.log(m) || alert(m); 

//console.log( this, key, options );

if( key == "image" ){

alert("image")

}else if( key == "edit" ){

alert("edit");

}

},

build: function($triggerElement, e){

var tg = $(e.currentTarget);

var items_obj = new Object();

items_obj = { items : {} };


if( tg.hasClass( "full" ) ){

items_obj = {

items: {

/*"edit": {name: "Edit", icon: "edit" },

"cut": {name: "Cut", icon: "cut"},

copy: {name: "Copy", icon: "copy"},

"paste": {name: "Paste", icon: "paste"},*/

"paste": {name: "full", icon: "paste"},

"imDelete": {name: "imDelete", icon: "delete"}

}//end. item

}//end. items_obj

}else if( tg.hasClass("single") ){

items_obj = {

items: {

"edit": {name: "single", icon: "edit" }

/*

"cut": {name: "Cut", icon: "cut"},

copy: {name: "Copy", icon: "copy"},

"paste": {name: "Paste", icon: "paste"},*/

}//end. item

}//end. items_obj

}


delete items_obj.items.imDelete;


items_obj.items.common_edit = {name: "이름변경", icon: "edit" };

items_obj.items.common_image = {name: "이미지 원본사이즈 복원", icon: "edit"};

items_obj.items.common_delete = {name: "삭제", icon: "delete"};

items_obj.items.sep1 = "---------";

items_obj.items.quit = {name: "Quit", icon: function(){

return 'context-menu-icon context-menu-icon-quit';

}

};

return items_obj;

}//end. build

});

$(".contextMenu").contextMenu(false);

$(".contextMenu").contextMenu(true);

});

</script>


간단한 내용인데 영감은 아래에서 얻었다 


source : http://stackoverflow.com/questions/1168807/how-can-i-add-a-key-value-pair-to-a-javascript-object

댓글