jQuery UI对话框添加了内容

per*_*ai1 4 jquery jquery-ui jquery-ui-dialog

有没有办法在jQuery UI对话框的两个按钮之间添加内容?使用下面的代码,我OR想写在两个按钮之间.这可能吗?

$("#dialog-delivery").dialog({
              bgiframe: true,
              resizable: true,
              height:350,
              width:400,
              modal: true,
              buttons: {
                  "Continue": function() {
                        $(this).dialog( "close" );
                        $(".option-separate").hide();
                        $("#nonsubscribers").hide();
                        $('<div class="radio-alert">Thank you for your selection</div>').appendTo('#subscribers');
                        $("#change-subs").css('visibility','visible');
                    },
                    "Change to Non-Subscriber": function() {
                          $(this).dialog( "close" );
                          $("#subscribers").hide();
                          $(".option-separate").hide();
                          $("#nonsubscribers").show();
                          $("#change-nonsubs").css('visibility','visible');
                      }
              }
    });
Run Code Online (Sandbox Code Playgroud)

End*_*der 5

这是一个小黑客,但看看这个演示 - >

相关的添加是一个对话框打开处理程序:

open: function() {
    $('.ui-button-text:contains("Continue")')
        .parent()
        .after('<div class="button-divider">OR</div>');
}
Run Code Online (Sandbox Code Playgroud)

这样做:选择一个带有特定文本的ui按钮,然后插入一个<div>.该类非常重要,因为您需要至少一种CSS样式才能正确放置分隔符.这是我使用的样式:

.button-divider {
    margin: .5em .2em .5em 0;
    float: right;
    padding: .2em 0 .3em 0;
    width: auto;
}
Run Code Online (Sandbox Code Playgroud)

重要的是float:right;,因为ui按钮是浮动的,所以你的分隔符也必须浮动,以便正确放置.