Question

Bootstrap 3，弹出窗口被剪切在包含在table-responsive中的表中。我尝试了很多方面，例如将table-responsive课程设置为overflow-y: visible;，但没有任何帮助。希望有人能指出我正确的方向。

编辑：不确定这是否有所不同，但我也使用数据表来显示表格。虽然，老实说，我不能从中找到任何问题。

编辑2： https://jsfiddle.net/ujj3zkdq/

Answer 1

将z-index添加到弹出元素。例如： z-index：1111;

更新

用此替换功能。您可以将展示位置更改为顶部，右侧，左侧或自动。

$(function() {
    $('table').DataTable({
       paging: false,
       searching: false,
       lengthChange: false
    });

    $('[data-toggle=popover]').popover({
       placement: "right",
       trigger: 'focus'
    });
});

Answer 2

尝试将您的popover的container属性设置为'body'，将您的popover容器设置为<body>标记。像这样：

$('#myPopover').popover({container: 'body'});

或

<a href="#" data-toggle="popover" data-container="body" title="Popover Header" data-content="Some content inside the popover">Toggle popover</a>

在此处阅读更多http://www.w3schools.com/bootstrap/bootstrap_ref_js_popover.asp

Answer 3

尝试添加选项container: "body"，它会起作用

$(document).popover({
    selector: '[data-toggle=popover]',
    html: true,
    trigger: 'focus',
    container: "body"
});

表内的弹出窗口响应被剪裁

3 个答案: