在jQuery UI对话框中的特定div内添加按钮

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>