Question

$(document).ready(function(){

    $("div").mouseup(function(){
        $(this).after("<p style='color:green;'>Mouse button released.</p>");
    });
    
    $("div").mousedown(function(){
        $(this).after("<p style='color:purple;'>Mouse button pressed down.</p>");
    });
});

<!DOCTYPE html>
<html>
<head>
<style>
div {
    height: 200px;
    width: 50%;
    background-color: powderblue;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

</head>
<body>

<div style="border:1px solid red">Press down and release the mouse button over this div element.</div>
<input type="file"/>

</body>
</html>

嗨，我正在使用＆lt; input type =“file”＆gt;在我的代码中选择文件。当我打开文件上传对话框并使用双击选择文件时，如果该文件上传对话框通过下面的div控件覆盖（重叠），那么我的div元素将触发mouseUp事件。

现在打开文件上传/选择对话框并使用双击选择文件，但是将对话框置于div元素被覆盖的位置（相互重叠）并双击文件选择应该有div元素在它之下。

只要在文件上传窗口中双击选择文件，就会看到mouseup事件被触发。双击事件传递给div元素下面。知道输入类型文件的问题吗？如何保护/避免它？任何解决方案？

Answer 1

你的逻辑有问题。如果您在此处尝试运行代码段，它实际上允许您在单击输入字段后双击文件，除非您希望它在单击div之后启动，在这种情况下，jquery应该调用输入字段点击一下。

HTML <input type =“file”/>：双击选择文件，下面的控件会触发mouseUp事件

1 个答案: