如何在循环中使用 Material Design “mdl-tooltip”

Posted 2023-02-22

【中文标题】如何在循环中使用 Material Design “mdl-tooltip”

【英文标题】：How to use Material Design "mdl-tooltip" in a loop

【发布时间】：2017-07-30 18:17:06

【问题描述】：

我正在使用 materialdesign 库的工具提示： https://getmdl.io/components/#tooltips-section

我想在循环中使用此功能，但这当然行不通，因为 mdl 正在使用“id's”（本例中为 tt4）来触发图标并显示其工具提示。

我怎样才能让它循环工作并将正确的工具提示链接到正确的图标？

非常感谢！

我的 php laravel 刀片代码：

                <td>
                @if ($note->text)
                    <div id="tt4" class="icon material-icons">info</div>
                    <div class="mdl-tooltip" for="tt4">
                        !! md($note->text) !!
                    </div>
                @endif

            </td>

【参考方案1】：

您是否尝试过使用 PHP 回显动态注入代码。 PHP 是第一个运行的东西，所以它会为你评估所有其他的东西。

 echo "<div id="+$blah+">";

类似的东西

当你动态生成 MDL 时，你可能需要使用这个：

componentHandler.upgradeElements($('.mdl-tooltip').get());