我有一个问题,bootstrap5弹出不能由jquery,总是显示错误
Uncaught TypeError: POPOVER: Option "content" provided type "undefined" but expected type "(null|string|element|function)".
我有7元素在我的html文件如下
<div class="col-5 offset-2">
<div class="user" style="text-align: center; margin: auto;" data-bs-toggle="popover">
@if($tlr->paid_status == 0)
<img src="{{asset('assets/user/user.png')}}" alt="**" style="width:100%;">
@else
<img src="{{asset('assets/user/paid_user.png')}}" alt="**" style="width:100%;">
@endif
{{$tlr->username}}
<div class="userInfo" data-name="popover-content">
<div class="panel panel-success" style="text-align: center;">
<div class="panel-heading">
<a href="{{url('tree/'. $tlr->username)}}">
<h4>{{$tlr->username}}</h4>
</a>
</div>
<div class="panel-body">
<?php
echo "<h5>".strtoupper("$tlr->first_name $tlr->last_name")." </h5> $paid";
printBV($tlr->id);
printBelowMember($tlr->id);
?>
</div>
</div>
</div>
</div>
</div>
我在用户类中设置了data-bs-toggle="popover"
以使用bootstrap5弹出窗口。我在同一个html页面中有7个类似的元素,因此我将类的每个循环使用为
$(document).ready(function() {
$('.user').each(function() {
var $this = $(this);
var options = {
trigger: 'click , hover',
placement: 'bottom',
html: true,
// content: $(".userInfo").html(),
content: $this.find('.userInfo').html()
}
var popover = new bootstrap.Popover($this, options)
});
});
但它会产生错误
Uncaught TypeError: POPOVER: Option "content" provided type "undefined"
并且不能弹出所有元素,一些元素弹出但一些元素不能弹出,
为什么会发生这种情况,我需要做单独的类名称?
怎么能解决。
1条答案
按热度按时间56lgkhnf1#
你的代码没有问题。只要确保你包含了引导链接。试试这个