Question

有没有办法将按钮添加到jquery对话框模式的特定部分？例如，我的样式目前条件是按钮位于具有特定类名的div中，有没有办法让我将按钮定位到div内？

HTML：

<div id="dialog-confirm" title="Header">
 <div class="modal-inner2">
  <div class="modal-header2">
  <h1>Header</h1>
 </div>
 <div class="modal-content">

    <p>I'm text</p>

   <div class="BtnGoHere"></div>

 </div>

JS：

$(function() {
$( "#dialog-confirm" ).dialog({
resizable: false,
height: "auto",
width: 400,
modal: true,
buttons: [
  {
    text: "Cancel",
    "class": "btn btn-cancel",
    click: function() {
      $( this ).dialog( "close" );
    }
  },
  {
    text: "Save",
    "class": "btn",
    click: function() {
      $( this ).dialog( "close" );
    }
  }
]
});
});

Answer 1

我一直在玩你的代码，我想我找到了解决方案：

<强> HTML：

<div id="dialog-confirm" title="Header">
 <div class="modal-inner2">
  <div class="modal-header2">
  <h1>Header</h1>
 </div>
 <div class="modal-content">

    <p>I'm text</p>

   <div class="BtnGoHere"></div>

 </div>

<强>使用Javascript：

    $(function() {
        $( "#dialog-confirm" ).dialog({
        resizable: false,
        height: "auto",
        width: 400,
        modal: true,
        buttons: [
          {
            text: "Cancel",
            "class": "btn btn-cancel",
            click: function() {
              $( this ).dialog( "close" );
            }
          },
          {
            text: "Save",
            "class": "btn",
            click: function() {
              $( this ).dialog( "close" );
            }
          }
        ]
        });
    });

    $( ".BtnGoHere" ).append( "<input type='button' value='NewButton' />" );

如您所见，您只需要使用要插入新元素的元素中的append方法。在这里你有一个jsfiddle的链接来检查代码工作： https://jsfiddle.net/1yfu4w8o/

希望它有所帮助！

Answer 2

只需将按钮放在HTML中的模态中即可 <div class="BtnGoHere"> <button class="btn" type="button">Close</button> <button class="btn" type="submit">Save</button> </div>

在jquery ui对话框中添加特定div内的按钮

2 个答案: