点击元件工作不稳定

Question

$scope.clickUpload = function(){
        $timeout(function() {
            angular.element('#upload').trigger('click');
        }, 100);
    };

例如，点击3次就可以了，但是点击4次就什么都没有了我该如何解决这个问题?

Answer 1

我正在编辑我的原始答案，因为我没有完全理解你想要做什么。你可以设置input type="file"的样式，而不必使用jQuery/javascript来隐藏原始元素并模拟点击它。你可以使用标准的HTML/CSS来完成…

CSS:

.upload  {
    height:25px;
    width:70px;
    background:#ccc;
    color:#fff;
    overflow:hidden;
    text:'Upload';
}
.upload input {
    display: block !important;
    width: 70px !important;
    height: 25px !important;
    opacity: 0 !important;
    overflow: hidden !important;
}
#uploadText {
    left: 6px;
    position: relative;
    top: -45px;
}

HTML:

<div class="upload">
  <input type="file" name="upload" />
  <h3 id="uploadText">Upload</h3>
</div>

考虑到这些都不是理想的样式，我也没有未来的平面设计师，它们足以展示如何修改标准输入type="file"的样式，而不需要javascript。