输入类型＝“;文件“;onclick有效，但文件选择不显示

Input type="file" onclick works, but file selection doesnt show

本文关键字：文件 选择 显示 onclick 类型 输入 有效      更新时间：2023-09-26

我有以下代码：

<a id="newPhoto" class="new-image no-expand">
    <input onclick="alert('cocos')" type="file" style="display: block; position: absolute; z-index: 1500"/>
    <button class="btn btn-primary btn-upload clickable no-expand"
            style="font-family: Montserrat, 'Helvetica Neue', Helvetica, Arial, sans-serif;">
    <i class="fa fa-upload"></i> Upload
    </button>
    <br><br>
    <div title="Remove" class="btn-remove">
        <span class="glyphicon glyphicon-remove" style="color: white"></span>
    </div>
</a>

现在，当单击input时，按钮上click的视觉效果以及onclick事件处理程序都会被触发，但由于某种原因，让我选择文件的弹出对话框没有。我还试图删除任何css，并确保点击了确切的项目，并且它没有被另一个div或类似的东西覆盖。知道吗？

问题是由于我在a中嵌套了一个input。它不是有效的HTML。然而，如果我没有同时使用Angular，它可能会起作用，因为如果没有src属性，任何点击任何<a>的操作都将无效。

var htmlAnchorDirective = valueFn({
restrict: 'E',
compile: function(element, attr) {
  if (!attr.href && !attr.xlinkHref) {
    return function(scope, element) {
      // If the linked element is not an anchor tag anymore, do nothing
      if (element[0].nodeName.toLowerCase() !== 'a') return;
      // SVGAElement does not use the href attribute, but rather the 'xlinkHref' attribute.
      var href = toString.call(element.prop('href')) === '[object SVGAnimatedString]' ?
                 'xlink:href' : 'href';
      element.on('click', function(event) {
        // if we have no href url, then don't navigate anywhere.
        if (!element.attr(href)) {
          event.preventDefault();
        }
      });
    };
  }
}
});

将容器更改为div解决了这个问题。

在您的代码中，单击警报框中的"确定"按钮后会出现文件对话框。点击此处

Please see my code in the above Link.
相关文章：