jquery 대화 상자 단추에 클래스 추가

Question

jquery 대화 상자의 단추에 css 클래스를 추가하고 싶습니다.

$(document).ready(function(){ 
     $('#messageBox p').html('bla bla bla. Ok?'); 
     $('#messageBox').dialog({ 
     modal : true, 
     buttons: { 
      'Yes': function() { 
      doSomething(); 
      $(this).dialog('close'); 
      }, 
      'No': function() { 
      doAnotherThing(); 
      $(this).dialog('close'); 
      } 
     } 
     }); 
    }); 

예를 들어, 내가 "예"버튼을 ".red"클래스를 추가하고 싶습니다 :

여기 내 코드입니다.

어떻게하면됩니까?

감사합니다.

Answer 1

buttons: [ 
      { 
       text: "Submit", 
       "class": 'submit_class_name', 
       click: function() {      
        $(this).dialog("close"); 
       } 
      }, 
      { 
       text: "Cancel", 
       click: function() { 
        $(this).dialog("close"); 
       } 
      } 
      ] 

Answer 2

addClass 기능을 사용해 보셨습니까?

Answer 3

.addClass는 대화 자체에 대한 CSS 클래스를 지정하는 데 사용할 수있는 대화 기능의 dialogClass 옵션이있다  

Answer 4

작동합니다. 고유 한 클래스 이름을 지정하고이 클래스 이름을 사용하여 대화 상자의 하위 요소에 대한 참조를 가져올 수 있습니다. 그런 다음 선택기를 사용하여 하위 단추에 대한 참조를 위치 또는 포함 된 텍스트로 가져옵니다 (아마도 이전을 사용하는 것이 더 효율적입니다).

Answer 5

나는 리치에, 감사 솔루션을 가지고 :

$(document).ready(function(){ 
     $('#messageBox p').html('bla bla bla. Ok?'); 
     $('#messageBox').dialog({ 
     modal : true, 
     dialogClass: 'dialogButtons', 
     buttons: { 
      'Yes': function() { 
       doSomething(); 
       $(this).dialog('close'); 
      }, 
      'No': function() { 
       doAnotherThing(); 
       $(this).dialog('close'); 
      } 
     } 
     }); 
    }); 
$("div.dialogButtons div button:nth-child(1)").addClass("oneCssClass"); 
$("div.dialogButtons div button:nth-child(2)").addClass("anotherCssClass"); 

가 해결!

Answer 6

같은 문제가있었습니다.

open: function() { 
       // add style to buttons (can't seem to do this via the button definition without breaking IE) 
       $(".someDialog .ui-dialog-buttonset button:first").not(".buttonPrimary").addClass("buttonPrimary"); 
       $(".someDialog .ui-dialog-buttonset button:last").not(".buttonSecondary").addClass("buttonSecondary"); 
       $("#someDialog").focus(); 
      }