允許對目標事件執行默認操作，並針對父級阻止默認操作

Question

我們有這種標記：

<a href="#">
   <input type="file" />
</a>

默認情況下，當您單擊輸入時，將顯示 “選擇文件”窗口，並且位置更改為“＃”。 如何防止瀏覽器更改位置？

我嘗試過的

//location still changes
$('input').bind('click', function (e) {
  e.stopPropagation();
});

//prevents "Select file" window
$('input').bind('click', function (e) {
  e.preventDefault();
});

//prevents "Select file" window 
$('a').bind('click', function (e) {
  e.preventDefault();
});

Answer 1

嘗試將$(e)更改$(e) e.

e.preventDefault();

在執行$(e).preventDefault()導致錯誤

Uncaught TypeError: Object [object Object] has no method 'preventDefault' 

Answer 2

您需要檢查用戶是否單擊了a元素而不是輸入文件。 這應該工作。

$('a').click(function(e) {
    if ($(e.target).is('a')) {
        e.preventDefault();
    }
});

DEMO