将按钮添加到列表组 Bootstrap 上的链接项目答案

【问题标题】：Add buttons to linked items on list group Bootstrap将按钮添加到列表组 Bootstrap 上的链接项目
【发布时间】：2017-03-18 13:26:00
【问题描述】：

我正在尝试实现一个系统，我需要链接组列表中的按钮。问题是当我单击按钮时，它会打开链接项目的链接。下面的代码是我系统上的代码。

编辑：我需要完整的项目是可点击的；不包括按钮（不使用文本上的链接）。

<head>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
  
<a class="list-group-item list-group-item-info" href="https://www.fumep.edu.br/eep/" target="_blank">
    EEP
    <span class="pull-right">
        <div class="btn-group" role="group" aria-label="...">
            <span class="btn btn-xs btn-warning" >
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
            </span>
            <span class="btn btn-xs btn-danger" >
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
            </span>
        </div>
    </span>
</a>

【问题讨论】：

标签： html css twitter-bootstrap button itemgroup

【解决方案1】：

你可以像这样使用 CSS..

.list-group-item>.pull-right{
   cursor: default;
}

将onclick="return false;" 添加到 btn 组。

Demo

【讨论】：

我需要列表项的整个区域都可以点击，不包括按钮

【解决方案2】：

如果你想要除了按钮之外的所有项目都可以点击，你可以用 jQuery 试试这个

$('.btn-group .btn').click(function(
    e.preventDefault();
});

【讨论】：