버튼의 CSS 클래스를 동적으로 변경하는 방법이 있습니까?

StackOverflow https://stackoverflow.com/questions/516255

  •  21-08-2019
  •  | 
  •  

문제

개찰구 기반 웹 응용 프로그램을 작업하고 있습니다. 응용 프로그램에는 모든 사용자가 사용할 권한이없는 버튼이 있습니다. 이 버튼은 실제로 간단한 링크입니다

<a wicket:id="publishButton" title="Publish" class="rightPanel_publish"><wicket:message key="publish"/></a>

시각적 외관을 설정하는 CSS 클래스 (외부 CSS 파일)와 함께

a.rightPanel_publish {
    display: block;
    width: 90px;
    height: 27px;
    background: url( ../imgs/right_panel_icon03.gif ) left top repeat-y;
    text-decoration: none;
    color: black;
    padding: 12px 0px 0px 35px;
}

사용자가 버튼을 사용하도록 권한이없는 경우 링크가 비활성화되어 (Java) CSS는 더 이상 사용되지 않습니다.

내 질문 이것은 런타임에 링크가 비활성화되어 CSS 클래스를 변경한다는 것을 식별 할 수있는 방법이 있습니까? 차라리 JavaScript (지금까지 전체 프로젝트를 무료로 유지하기 위해 관리)를 사용하지 않고 모든 브라우저에서 작동하는 것을 선호합니다.

무리 감사,

유발 = 8-)

도움이 되었습니까?

해결책

불행히도 나는 JS없이 버튼의 페이지를 변경하는 방법을 모른다. 페이지가로드되는 동안 CSS, Java 및 기타 모든 것이 실행됩니다. 페이지가 페이지와 상호 작용하는 유일한 방법은 JS를 통해입니다.

그러나 다음은 모든 브라우저 (예 : 6+, Safari, Opera, FF 등)에서 작동하는 JS입니다.

  if(document.getElementById('foo'))
  {
    document.getElementById('foo').className='bar';
  }

다른 팁

어떤 종류의 스크립팅 없이는 이것을 할 수있는 방법이 없습니다. "dhtml"의 "d"는 "javaScript"를 나타냅니다.

편집 : 실제로, 당신이 말한 이후 무엇 링크/버튼을 비활성화하고 있으며, 무언가가 동일한 요소에 "비활성화 된"클래스 (CSS를 알아 차리는 유일한 X- 브라우저 방법)를 추가 할 수 있습니다. 런타임 스위칭이 시작되지 않습니다. 상태가 변경되면 상태가 변경되면 철저히해야합니다.

개찰구 링크는 u003Ca>태그를 u003Cspan>비활성화 된시기로 바꿉니다.u003C/span>u003C/a>

CSS를 적용 할 때 명심하십시오.

.rightPanel_publish_button {
  display: block;
  width: 90px;
  height: 27px;
  background: url( ../imgs/right_panel_icon03.gif ) left top repeat-y;
  text-decoration: none;
  color: black;
  padding: 12px 0px 0px 35px;
}

사용자 인증 상태를 기반으로 버튼의 모양 (예 : CSS 클래스)을 AtributeModifier로 변경할 수도 있습니다.

myButton.add(new AttributeModifier("class", new AbstractReadOnlyModel<String>() {

        private static final long serialVersionUID= 1L;

        @Override
        public String getObject () {
            if (!isAuthorized()) {
                return "rightPanel_unauthorized";
            }
            return "rightPanel_publishbutton";
        }
    }));

CSS에서는 필요에 따라 ".rightpanel_unauthorized"스타일을 정의합니다.

나는 그것을 사용한다 *.setVisible(Boolean boolean)

개찰구에서 WebMarkupContainer 모델에 사용할 수 있습니다. setVisible ()은 사용자 역할을 기반으로 클래스의 다른 곳에 할당 할 수 있습니다. 그래서 당신은 그것을 찾아야 할 수도 있습니다 ...

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top