상단 오른쪽 상단에서 'X'버튼을 비활성화 [복제

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

문제

가능한 복제 :
jqueryui 대화 상자에서 닫기 버튼을 제거 하시겠습니까?

나는 계속하기 전에 사용자가 용어에 동의 해야하는 대화 상자를 만들려고 노력하고 있으며, 사용자가 대화 상자의 오른쪽 상단에 'x'를 클릭하여 닫을 수 있도록 허용하지 않습니다. 사용자가 '동의'를 클릭해야합니다.

대화 상자에서 'x'를 비활성화하는 방법이 있습니까?

설명: 표준 jQuery UI 대화 상자를 사용하고 있습니다 : $ .dialog ().

도움이 되었습니까?

해결책

jQuery UI를 사용하고 있다고 가정합니다.

그렇다면 BeforeClose 이벤트 핸들러를 첨부하고 동의 버튼을 클릭하지 않은 경우 False를 반환하십시오. CSS를 사용하여 X 버튼을 설정할 수도 있습니다. {display: none}

var agreed = false; //has to be global
$("something").dialog({
    buttons: {
        'Apply': function () {
            agreed = true;
            $(this).dialog("close");
        }
    },
    beforeClose: function () {
        return agreed;
    }
});

다른 팁

나는 이것을 다른 게시물에서 발견했다.

$("#div2").dialog({
   closeOnEscape: false,
   open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }
});

이것이 링크입니다.

jQuery UI 대화 상자에서 닫기 버튼을 제거하는 방법은 무엇입니까?

대화 상자가 일반 팝업 창인 경우 사용자가 창을 닫지 못하게 할 수 없습니다.

JQuery Modal 대화 상자 플러그인을 사용할 수 있습니다. JQMODAL.

그러나 사용자가 기본 창을 닫지 못하게 할 수는 없습니다.

편집하다: JQuery UI 대화 상자를 사용하는 경우 다음 CSS 규칙을 추가 할 수 있습니다.

#someId .ui-dialog-titlebar-close {
    display: none;
}

당신은 설정해야합니다 closeOnEscape 에게 false.

또한, 왜 당신은 강제 사용자가 클릭합니다 I Agree?
왜 당신이 동의하지 않은 것처럼 닫힌 창을 취급 할 수 없습니까?

사용자가 X를 클릭하기 위해 허용하지 않는 한, 몇 가지 접근 방식 중 하나를 권장합니다.

  1. CSS 규칙을 사용하여 해당 버튼의 디스플레이를 '없음'으로 설정하십시오. FireBug의 검사 모드를 사용하면 jQuery UI 대화 상자가 위치한 태그를보고 CSS 규칙을 추가 할 수 있어야합니다. 디스플레이가 없으면 사용자는 클릭 할 수 없습니다.
  2. 마찬가지로, 아무것도하지 않는 jQuery .click () 이벤트를 첨부하고 이벤트 전파를 중지하기 위해 False를 반환합니다 (실제로는이 작업을 수행 한 적이 없지만 작동해야합니다).
  3. 사용자가 "동의"를 클릭하지 않은 경우 대화 상자가 닫히는 것을 방지 할 수있는 대화 상자의 beforeclose () 이벤트에 함수를 첨부 할 수 있습니다.
  4. 가장 복잡하지만 유용한 대화 상자가 있거나 다른 기능을 변경하려는 경우 유용하면 대화 상자를 인스턴스화하는 jQuery UI 플러그인을 작성하여 jQuery UI 대화 상자를 서브 클래스 한 다음 CSS 규칙을 적용하거나 이벤트를 첨부하여 기본 동작을 수정합니다. 위에서 설명한대로.

그 중 하나가 당신이 올바른 방향으로 가기를 바랍니다 ...

대화 상자의 Titlebar 용으로 만든 DIV에는 대화 상자를 참조하는 Aria-Labelledby 속성이 있음을 알았습니다 (UI-Dialog-Title- {YourDialogname}).

div.ui-dialog[aria-labelledby="ui-dialog-title-myDialog"] a.ui-dialog-titlebar-close {
    display: none;
}

또한 CloseOnescape를 False로 설정하여이를 방지했습니다.

관련 문제가 추가되었습니다. 사용자가 특정 대화 상자 창에서 X를 클릭 한 후 다시로드하십시오. .js에서 jQuery 대화 상자 기능에 추가되었습니다.

.click(function(i){ jQuery('span.ui-dialog-title').each(function(index) {


    if (jQuery(this).text() == '/**Title String Here**/') {

        a.close(i); location.reload(true); 

    } else {

        a.close(i);
    }

  });
return false})

이것은 SPAN 텍스트에서 제목을 찾고 닫을 때 다시로드되며 다시로드없이 닫습니다.

Michael Meadows의 답변을 보완합니다. 여러 양식이 있고 변수 글로벌을 원하지 않는 경우 양식 DOM 요소에 속성을 추가 할 수 있습니다. 같은 것 :

$('#yourForm').dialog(
 open : function(){
   $('#yourForm').attr('agreed', false);
 },
 beforeClose : function(){
   return $('#yourForm').attr('agreed') == 'true';
 },
 buttons:{'OK':function(){
        $('#yourForm').attr('agreed', true);        
        $(this).dialog('close');
    },
    'Cancel' : function(){
        $('#yourForm').attr('agreed', false);
        $(this).dialog('close');
    }
 }
);

나는 당신이 'true'와 비교해야한다고 생각하며, attr이 문자열로 저장된다고 생각하기 때문에 진실뿐만 아니라 진실이 아닙니다. 하지만 확실하지 않습니다 ....

사용하는 경우 alert, 아마도 당신은 고려해야 할 것입니다 confirm 대신에:

if (!confirm("Click OK to confirm that you agree to the terms and conditions.")) {
    // they didn't click OK
} else {
    // they did.
}

또는 사용 플러그인 Slaks가 언급 한 것처럼

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