Question

我想实现Bootstrap工具提示，当我将鼠标悬停在文本上时显示文章的全文。我有两个PHP文件。一个是view.php，另一个是fetchdata.php文件。 view.php文件向fetchdata.php发送GET个请求，并接收我要附加到内容div的Html表单数据。以下代码是fetchdata.php文件代码的一部分。

Fetchdata.php

echo
'<div class ="col-lg-3 col-sm-6 portfolio-item">
    <div class = "card h-100">
        <a href="'.$link.'" target = "_blank"> <img class = "card-img-top" src = "'.$thumbnail.'" alt= ""> </a>
        <div class ="card-body">
            <h4 class = "card-title">
                <a href ="'.$link.'" target = "_blank">'. $title.'</a>
            </h4>
            <p class ="card - text"> <a href = "#" data-toggle= "tooltip" title = "adsf">'.truncate($summary).'</a> </p>
        </div>
    </div>
</div>';

但它并没有奏效。我在互联网上搜索了这个，很多人写道我应该检查jquery和bootstrap初始化序列并确保它们是正确的。所以我检查了代码，发现没有问题。

View.php

<head>

    <meta name = "viewport" content = "width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <meta name ="description" content = "News project">                 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>     
    <link rel="stylesheet" type="text/css" href="newslistpage.css">


    <script>
    $(document).ready(function() {       
        $('[data-toggle="tooltip"]').tooltip();

        if (performance.navigation.type == 1){
            startpages = sessionStorage.getItem('startpages');

            $.get("fetchnews.php",{'p' : startpages},function(data) {
                $('#contentDiv').append(data);  
            });
        }
    }
    </script>

</head>

<body>
....
</body>

图片

当我将此测试代码添加到view.php的正文部分时，它运行良好。我想这个问题与php和javascript的关系有关。那么我的代码有什么问题，我该如何修复它们呢？

<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>

图片（将以上测试代码段放入代码后）

Bootstrap工具提示初始化不起作用

0 个答案: