Question

我正在使用Bootstrap（3.3.6），我注意到当试图通过点击它来选择网格列的文本（无论如何在Windows上）会产生一些奇怪的行为。

举例如下：

<div class="row form-horizontal">
  <div class="col-xs-12 col-sm-6 col-md-12">
        <div class="form-group mb0 sm-mb md-mb0">
            <label class="col-xs-12 col-sm-6 col-md-12 control-label">EAN</label>
            <div class="col-xs-12 col-sm-6 col-md-12 form-control-static">8718286480370</div>
        </div>
    </div>
</div>

这只显示一个包含EAN的标签及其值。当您尝试通过双击选择EAN值时，它也会选择标签EAN。有谁知道这是为什么，最好是如何让它只选择值？

请参阅下面的plunker了解一个工作示例。

https://plnkr.co/edit/Fm1WGGEx1wri0VrYrC0K?p=preview

编辑：

请注意，在标签之后添加句点（。）或冒号（:)会因某些原因使选择按预期工作，但这不是我想要的。我也试过添加隐形标点符号，但在某些时候它真的变成黑客攻击...

Answer 1

要回答我自己的问题，虽然仍然不确定为什么会在Chrome中发生这种情况，但解决方案很简单：将网格值放在他们自己的行上：

<div class="row form-horizontal">
  <div class="col-xs-12 col-sm-6 col-md-12">
        <div class="form-group mb0 sm-mb md-mb0">
            <label class="col-xs-12 col-sm-6 col-md-12 control-label">
                EAN
            </label>
            <div class="col-xs-12 col-sm-6 col-md-12 form-control-static">
                8718286480370
            </div>
        </div>
    </div>
</div>

Bootstrap网格的奇数选择行为

1 个答案: