Twitter bootstrap 3 Yii2：将Html:：tag（）与Html内容一起用于工具提示引导3

提示：按原始格式格式化不会解决我的问题-请参见附件图片：

下面的代码将使用方法

tag（）

的属性

title

实现工具提示

不幸的是，不可能在标题中呈现HTML标记。任何想法（欢迎链接）如何实现工具提示来处理我呈现HTML标记的意图？是否有其他选项在属性外部实现工具提示框

title

，以便我能够呈现HTML标记

    [
        'attribute' => $dummy,
        'label' => Yii::t('app', 'Charakterisierung'),
        'format' => 'raw',
        'vAlign' => 'middle',
        'value' => function($model) {
            if (!(empty($model->person->personentypDominant->typ_name))) {
                $tag = Html::tag('span', 'Tooltip-Touch Me!', [
                            // html-tags won't be rendered in title
                            'title' => $model->person->personentypDominant->typ_empfehlung],
                            'data-toggle' => 'tooltip',
                            'data-placement' => 'left',
                            'style' => 'white-space:pre;border:1px solid red;'
                ]);
                return $tag . "<br>" . $model->person->personentypDominant->typ_verhaltensmerkmal_im_team_1 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_bei_stress_3 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_am_arbeitsplatz_4;
            }
        }
    ],

[
'属性'=>$dummy，
'label'=>Yii:：t（'app'，'Charakterisierung'），
'格式'=>'原始'，
“vAlign”=>“middle”，
“值”=>函数（$model）{
如果（！（空（$model->person->personEnterprise->typ_name）））{
$tag=Html:：tag（'span'，'Tooltip Touch Me！'[
//html标记不会在标题中呈现
“title”=>$model->person->Personentype->typ_empfehlung]，
“数据切换”=>“工具提示”，
“数据放置”=>“左”，
'style'=>'空白：前置；边框：1px纯红色；'
]);
返回$tag.“
”、“$model->person->personEnterprise->typ\u verhaltensmerkmal\u im\u team\u 1.”、“$model->person->personEnterprise->typ\u verhaltensmerkmal\u bei\u pressure\u 3.”、“$model->person->personEnterprise->personEnterprise->typ->typ\u verhaltensmerkmarbai\u arbei\u 4；
}
}
],

采用如下3个参数

<?= Html::tag($name, $content = '', $options = []) ?>

将

GridView

的代码更改为以下内容，我假设

$model->person->personentypmagnetic->typ_empfehlung，

具有您尝试渲染的

HTML

[
    'attribute' => $dummy ,
    'label' => Yii::t ( 'app' , 'Charakterisierung' ) ,
    'format' => 'raw' ,
    'value' => function($model) {
        if ( !(empty ( $model->person->personentypDominant->typ_name )) ) {
            $tag = Html::tag ( 'span' , 'Tooltip-Touch Me!' , [
                   // html-tags won't be rendered in title
                   'title' => $model->person->personentypDominant->typ_empfehlung ,
                   'data-placement' => 'left' ,
                   'data-toggle'=>'tooltip'
                   'style' => 'white-space:pre;border:1px solid red;'
            ] );
            return $tag . "<br>" . $model->person->personentypDominant->typ_verhaltensmerkmal_im_team_1 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_bei_stress_3 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_am_arbeitsplatz_4;
        }
    }
];

---

编辑2

确保您没有将

AdminLTE

主题与

jquery UI

一起使用，因为它们之间存在冲突，请参见

jquery UI

工具提示和

bootstrap

工具提示冲突的原因是

jquery UI

工具提示覆盖

bootstrap

工具提示可能它们使用相同的命名空间和函数名

在javascript中添加以下代码（来自的解决方案）

Demo

$（文档）.ready（函数（）{
var bootstrapTooltip=$.fn.tooltip.noConflict（）；
$.fn.bstooltip=bootstrapTooltip；
$（'#mybtn'）.bstooltip（）；
})

盘旋我

采用如下3个参数

<?= Html::tag($name, $content = '', $options = []) ?>

将

GridView

的代码更改为以下内容，我假设

$model->person->personentypmagnetic->typ_empfehlung，

具有您尝试渲染的

HTML

[
    'attribute' => $dummy ,
    'label' => Yii::t ( 'app' , 'Charakterisierung' ) ,
    'format' => 'raw' ,
    'value' => function($model) {
        if ( !(empty ( $model->person->personentypDominant->typ_name )) ) {
            $tag = Html::tag ( 'span' , 'Tooltip-Touch Me!' , [
                   // html-tags won't be rendered in title
                   'title' => $model->person->personentypDominant->typ_empfehlung ,
                   'data-placement' => 'left' ,
                   'data-toggle'=>'tooltip'
                   'style' => 'white-space:pre;border:1px solid red;'
            ] );
            return $tag . "<br>" . $model->person->personentypDominant->typ_verhaltensmerkmal_im_team_1 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_bei_stress_3 . "," . $model->person->personentypDominant->typ_verhaltensmerkmal_am_arbeitsplatz_4;
        }
    }
];

---

编辑2

确保您没有将

AdminLTE

主题与

jquery UI

一起使用，因为它们之间存在冲突，请参见

jquery UI

工具提示和

bootstrap

工具提示冲突的原因是

jquery UI

工具提示覆盖

bootstrap

工具提示可能它们使用相同的命名空间和函数名

在javascript中添加以下代码（来自的解决方案）

Demo

$（文档）.ready（函数（）{
var bootstrapTooltip=$.fn.tooltip.noConflict（）；
$.fn.bstooltip=bootstrapTooltip；
$（'#mybtn'）.bstooltip（）；
})

盘旋我

请注意，现在bootstrap 3.4.1和4.3.1具有默认阻止大多数HTML标记的功能

如果工具提示（或popover）数据内容包含一个或多个未在默认白名单中列出的HTML标记，则需要手动添加它们：

var myDefaultWhiteList = $.fn.tooltip.Constructor.DEFAULTS.whiteList

// To allow table elements
myDefaultWhiteList.table = []

// To allow td elements and data-option attributes on td elements
myDefaultWhiteList.td = ['data-option']

// You can push your custom regex to validate your attributes.
// Be careful about your regular expressions being too lax
var myCustomRegex = /^data-my-app-[\w-]+/
myDefaultWhiteList['*'].push(myCustomRegex)

// initialize your tooltip
$(function () {
    $('[data-toggle="tooltip"]').tooltip({
        // set your custom whitelist
        whiteList: myDefaultWhiteList
    });
});

---

请注意，现在Bootstrap3.4.1和4.3.1有一个默认阻止大多数HTML标记的功能

如果工具提示（或popover）数据内容包含一个或多个未在默认白名单中列出的HTML标记，则需要手动添加它们：

var myDefaultWhiteList = $.fn.tooltip.Constructor.DEFAULTS.whiteList

// To allow table elements
myDefaultWhiteList.table = []

// To allow td elements and data-option attributes on td elements
myDefaultWhiteList.td = ['data-option']

// You can push your custom regex to validate your attributes.
// Be careful about your regular expressions being too lax
var myCustomRegex = /^data-my-app-[\w-]+/
myDefaultWhiteList['*'].push(myCustomRegex)

// initialize your tooltip
$(function () {
    $('[data-toggle="tooltip"]').tooltip({
        // set your custom whitelist
        whiteList: myDefaultWhiteList
    });
});

---

谢谢。很好用！：）很乐意帮助@tklustigt这里有任何名为vAlign for kartik\grid\DataColumn的属性。我用的是kartik的GridView！啊，没有提到，所以我认为您使用的是默认的gridview，也就是说，您提到的

yii\grid\DataColumn

将在回答中更新为formating as raw不会解决我的问题（请参见上面的提示），这是非常重要的。很好用！：）很乐意帮助@tklustigt这里有任何名为vAlign for kartik\grid\DataColumn的属性。我用的是kartik的GridView！啊，没有提到，所以我认为您使用的是默认的gridview，也就是说，您提到的

yii\grid\DataColumn

将在回答中更新为formating as raw不会解决我的问题（参见上面的提示）