Question

我的表单中有输入组：

 <div class="input-group">
        <div class="input-group-addon" data_toggle="tooltip" data_placement="left" data_content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." id="Contact">
            @Html.LabelFor(model => model.EmployeeNo, new { @class = "control-label" })
        </div>
        <div class="">
            @Html.TextBoxFor(model => model.EmployeeNo, new {@class="form-control" })
            @Html.ValidationMessageFor(model => model.EmployeeNo)
        </div>
    </div>

和此脚本调用的工具提示：

$(document).ready(function () {
    $('#Contact').tooltip();
});

包括Jquery和bootstrap。浏览器控制台中没有警告和错误。我做错了什么？

Answer 1

我不确定你为什么在这里使用data_content。但是，bootstrap需要title属性作为工具提示，因此请将其添加到div：

<div class="input-group-addon" data_toggle="tooltip" data_placement="left" title="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data_content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." id="Contact">
    @Html.LabelFor(model => model.EmployeeNo, new { @class = "control-label" })
</div>

Answer 2

tooltip功能会显示您添加到title的{{1}}属性中的所有内容。

因此，您应该将工具提示文本添加到div：

div

另一种可能性是在创建工具提示时设置<div title="..." class="input-group-addon" data_toggle="tooltip" data_placement="left" data_content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." id="Contact"> @Html.LabelFor(model => model.EmployeeNo, new { @class = "control-label" }) </div>属性：

content

工具提示没有显示出来

2 个答案: