javascript - 离开文本区域时按钮单击不触发

标签 javascript jquery html css angularjs

我目前正在制作一个将自动扩展的文本区域。这似乎工作正常但是当文本区域被扩展时按钮点击似乎永远不会触发。我也在使用 angularjs。这是我的代码

HTML:

<body >
    <div my-dir></div>
</body>

Javascript:

var app = angular.module('myApp',[]);

app.directive('myDir', function(){
    return {
        restrict:'A',
        template:'<textarea id="textarea1">'+'</textarea>' + '<button ng-click="clicked()">Click me</button><textarea id="textarea2"></textarea>',
        link:function(scope){
            scope.clicked = function(){
                 alert("click worked");
            }
        }
    }
});

如果有人可以帮助我找到解决方法或解释为什么会发生这种情况,我们将不胜感激。

代码笔链接:http://codepen.io/anon/pen/mJrjpP

最佳答案

当文本区域获得焦点时,按钮向下移动一点,当您单击按钮时,文本区域模糊事件首先触发,将按钮向上移动,因此点击永远不会发生,因为按钮移动了。

解决方案是确保按钮保持原样,使用 CSS 定位,或如下面 gyantasaurus 的评论所述

<button ng-mousedown="clicked()">Click me</button>

关于javascript - 离开文本区域时按钮单击不触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30397013/

相关文章:

javascript - 获取选中的单选按钮时出现问题 - JavaScript

javascript - jQuery 在数字出现的地方进行分割

javascript - 交替选项卡上的开/关单击事件

javascript - 我想在所有没有类 'block' 的 div 中附加提到的标签

android - 选择元素在 Android 2.3.x 中不更新

php - 在 GET 请求中保留值

javascript - 如何在jquery中搜索属性值的一部分?

javascript - 我的 JS 代码有什么区别?

python - 在scrapy爬行中使用css选择器提取span之外的文本

python - bottle request.forms.get 返回 None