我已经使用引导程序在Sharepoint上制作了一个网页,并且内容使用javascript填充。我在表中使用弹出框。该表是通过javascript生成的。奇怪的是,弹出窗口仅在刷新页面/用F5重新加载后才起作用。
表格外的弹出式窗口在第一次加载时工作正常。代码在我的本地计算机上运行正常,没有问题,但是在共享点上,它崩溃了。
这里是一些代码-初始化:
<script src="jquery-3.5.1.slim.min.js"></script>
<script src="popper.min.js"></script>
<script src="bootstrap.min.js"></script>
然后生成表的函数称为:
<body onload="javascript: GenerateTable();">
随后是popper调用:
$(function () {
$('.example-popover').popover({
})
})
结果是一个表,其中包含带有popper的以下行:
<td>Here is a question which needs a popper as info!
<div class="row justify-content-end">
<a href="#!" tabindex="0" class="badge badge-info" role="button" data-toggle="popover" data-trigger="focus" title="" data-content="This is a funny popover" title="Info">Info</a>
</div>
</td>
在我看来,这似乎是加载顺序的问题-但无法弄清楚为什么它在本地而不是在Sharepoint上起作用。
问题是javascript执行的顺序。由于代码是从外部javascript文件加载的,因此代码的加载顺序未知。
因此,建议将html文件中的javascript函数放到javascript文件中的显式函数中。然后必须显式调用该函数。
Javascript文件:
function PopperCall(){
$('.example-popover').popover({});
$('.popover-dismiss').popover({trigger: 'focus'});
$('[data-toggle="popover"]').popover();
}
在HTML中,加载是通过以下方式完成的:
<body onload="javascript: GenerateTable(); PopperCall();">