Javascript 如何使用引导重置弹出模式的位置？

我一直在寻找解决问题的方法，我看到了很多不同的方法，但没有一种对我有效。 我会把我的代码贴在这里，看看你是否能帮我。 我有一个可拖动的弹出窗口来显示注释。主屏幕上有一个项目列表，用户每次单击“查看”链接时，都会打开带有此特定项目注释的弹出窗口。 一切正常。弹出窗口以正确的信息打开，我可以在屏幕上移动弹出窗口。那么我唯一的问题是： 一旦我关闭弹出窗口并打开一个新的弹出窗口，而不是将弹出窗口重置为原始位置，它将在我离开另一个弹出窗口的地方打开。当用户关闭弹出窗口时，我需要重置其位置

这是我的js：

require(['jquery'
    , 'bootstrap'
    , 'datepicker'
    , 'typeahead'
    , 'combobox'
    , 'tagsinput'
], function($){

    // DOM ready
    $(function(){
        $('.modal-dialog').draggable();

        $('#noteModal').on('show.bs.modal', function(e) {

            //get data-id attribute of the clicked element
            var note = $(e.relatedTarget).data('note');
            //populate the textbox
            $(e.currentTarget).find('span[name="note"]').text(note);
        });



    });
});

这是我的html页面上的模式：

<!-- Modal to display the Note popup -->
<div class="modal" id="noteModal" tabindex="-1" role="dialog" aria-labelledby="noteModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="noteModalLabel">Note</h4>
            </div>
            <div class="modal-body">
                <span name="note" id="note"></span>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

&时代；
注
接近

如何在用户每次关闭弹出窗口时重置其位置

---

谢谢大家!

在单击处理程序中，可以使用JQuery设置模式的css，如下所示：

if (!$(".modal.in").length) {
  $(".modal-dialog").css({
    top: 0,
    left: 0
  });
}

这将重置模态的位置。您可以在JavaScript中调用模态之前使用它，假设您使用JS打开模态

请尝试运行下面的代码段，或查看此以了解使用模式的示例

//DOM就绪
$（函数（）{
$（“.modal dialog”）.draggable（）；
$（“#btn1”）。单击（函数（）{
//如果不可见，则重置模式
如果（！$（“.modal.in”）.length）{
$（“.modal dialog”）.css({
排名：0，
左：0
});
}
$（“#noteModal”）.modal({
背景：错，
秀：真的
});
});
$（“#noteModal”）。on（“show.bs.modal”，函数（e）{
var注释=$（'btn1'）。数据（'note'）；
$（e.currentTarget）.find（'span[name=“note”]'）.html（note）；
});
});

&时代；
注
接近
显示模态
谢谢！有了这些，我开始有所进展。。。它不是重置弹出窗口，而是只重置列表中的最后一个元素。我将尝试在这里应用一些更改，看看它是如何运行的：）Dan，我可以通过修改js代码来获得button.className而不是通过ID获得它，从而使它在CodePen上工作。它在那里工作得很好，但当我在代码上这样做时，它就不工作了。然后我尝试添加onclick，调用名为resetModal的函数，该函数包含您提到的代码。我可以看到该函数在控制台上被调用，但什么也没发生。模态开关没有打开。你知道会发生什么吗？你是用JavaScript触发你的模态还是用
data toggle=“modal”
？可以发布更多的代码吗？另一种可能是在你的
show.bs.modal
函数中设置css——这里有一个例子。没问题：）我很高兴它能帮上忙。