jQuery EasyUI는 마우스 오른쪽 버튼 클릭 menu_jquery를 회색으로 표시하는 효과를 실현합니다.

우선 '그렇지 않으면 모두 닫기' 옵션이 회색으로 표시되어 사용할 수 없습니다.

한 개의 탭만 열려 있는 경우 마우스 오른쪽 버튼 클릭 메뉴의 "한 개만 제외하고 모두 닫기"가 회색으로 표시되어 사용할 수 없게 됩니다. 이렇게 하면 이 탭 외에는 다른 탭이 없다는 것을 사용자에게 알릴 수 있습니다. 프로그램 구현은 매우 간단합니다. 열린 탭 수를 가져오면 됩니다. 숫자가 1이면 "다음을 제외하고 모두 닫기"를 회색으로 설정하여 사용할 수 없게 만듭니다.

var tabcount = $('#tabs').tabs('tabs').length; //tab选项卡的个数 
  if (tabcount <= 1) { 
    $('#mm-tabcloseother').attr("disabled", "disabled").css({ "cursor": "default", "opacity": "0.4" }); 
  } 
  else { 
    $('#mm-tabcloseother').removeAttr("disabled").css({ "cursor": "pointer", "opacity": "1" }); 
  } 

참고: Firefox, Google, Opera 브라우저에서는 "disabled" 속성이 작동하지 않으므로 CSS 스타일을 추가하고 투명도를 회색으로 설정했습니다.

렌더링:

사진1: 이것 빼고 다 닫아요

둘째, '현재 페이지 오른쪽에 있는 모두 닫기'가 회색으로 표시되어 사용할 수 없게 됩니다.

탭 오른쪽에 탭이 없으면 탭이 회색으로 표시되어 사용할 수 없게 됩니다. 프로그램 구현은 어렵지 않습니다. 마지막 탭의 제목을 가져와서 현재 오른쪽 클릭 메뉴가 있는 탭의 제목과 비교하면 됩니다. 현재 페이지'는 회색으로 표시되어 사용할 수 없습니다.

var tabs = $('#tabs').tabs('tabs');   //获得所有的Tab选项卡 
var tabcount = tabs.length; //Tab选项卡的个数 
var lasttab = tabs[tabcount - 1]; //获得最后一个Tab选项卡 
var lasttitle = lasttab.panel('options').tab.text(); //最后一个Tab选项卡的Title 
var currtab_title = $('#mm').data("currtab"); //当前Tab选项卡的Title 
 
   if (lasttitle == currtab_title) { 
     $('#mm-tabcloseright').attr("disabled", "disabled").css({ "cursor": "default", "opacity": "0.4" }); 
   } 
   else { 
     $('#mm-tabcloseright').removeAttr("disabled").css({ "cursor": "pointer", "opacity": "1" }); 
   } 

렌더링:

사진 2 : 현재 페이지 오른쪽 모두 닫기

셋째, "현재 페이지 왼쪽의 모두 닫기"가 회색으로 표시되어 사용할 수 없게 됩니다.

두 번째 탭의 제목과 정반대입니다. 첫 번째 탭의 제목을 가져와 현재 탭의 제목과 비교합니다.

var onetab = tabs[0]; //第一个Tab选项卡 
var onetitle = onetab.panel('options').tab.text(); //第一个Tab选项卡的Title 
   if (onetitle == currtab_title) { 
     $('#mm-tabcloseleft').attr("disabled", "disabled").css({ "cursor": "default", "opacity": "0.4" }); 
   } 
   else { 
     $('#mm-tabcloseleft').removeAttr("disabled").css({ "cursor": "pointer", "opacity": "1" }); 
   } 

마지막으로 얻은 효과는 아래와 같습니다

사진 3: 현재 페이지의 왼쪽을 모두 닫습니다

위의 내용은 세 가지 상황에서 회색으로 표시되고 사용할 수 없는 효과를 구현한 것입니다. 마우스를 놓고 클릭하면 오른쪽 클릭 메뉴가 사라지게 됩니다. 실제로 해결 방법은 매우 간단합니다. 모두에게 영감을 줍니다.