javascript - 表内按钮的 ZeroClipboard/ng-clip 悬停状态问题

标签 javascript css angularjs zeroclipboard

我正在使用利用 ZeroClipboard 库的 ng-clip。但是我在复制按钮时遇到了悬停状态问题。

在表格行上悬停它确实会返回到完全不透明。但是当我去点击按钮时,它突然删除了悬停状态并且悬停状态不会保持事件状态。

这是我的 jsfiddle http://jsfiddle.net/meetgodhani/yu1t5g2v/ .以下是我的代码。

CSS

.sample-button
{
    opacity:0.3;
}

.table-hover>tbody>tr:hover>td .sample-button {
  opacity:1;
}

JavaScript

angular.module('clip', ['ngClipboard']);

function Main($scope) {
    $scope.copytext = "Copy me !";
}

HTML

<h1> ngClip Example </h1>
<table class="table table-hover">
    <thead>
        <tr>
            <th>#</th>
            <th>Button</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td><a href="#" clip-copy="copytext" class="btn btn-primary sample-button">Button</a></td>
        </tr>
    </tbody>
</table>

知道如何解决吗?

非常感谢您的帮助。

最佳答案

这是我认为的解决方案

http://jsfiddle.net/yu1t5g2v/7/

onDomready

我更改了 JSFiddle 的菜单选项。

change here

希望对您有所帮助。它必须类似于 jQuery 中的“文档就绪”。

关于javascript - 表内按钮的 ZeroClipboard/ng-clip 悬停状态问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25573334/

相关文章:

javascript - 键值对初始化不适用于变量?

javascript - 如何在jtree搜索过滤器jquery中播种结果多词组合匹配(jtree中的多词和条件)

html - 如何适配屏幕

javascript - angular-bootstrap 日期选择器显示 'yyyy-mm-dd' 格式的错误日期

javascript - 计算ng重复Angularjs中值的总和

javascript 根据关联数组键值从数组中查找值

javascript - Angular添加功能回复评论

html - 媒体查询不执行任何操作

css - 如何从 graphQl 查询中获取变量到内联样式或样式化组件中的伪元素

javascript - 如何获取 AngularJS 中 ngRepeated 元素的当前子范围?