html 輸入需要 label

Question

我使用label + 隱藏input .file 來自定義 CSS 樣式。

但是當我添加一個required的屬性時，它不起作用。

在控制台日志中： name='imageFile'的無效表單控件不可focusable. .

在沒有 JavaScript 的情況下，有沒有辦法解決這個問題？

 <div> <label for="imageFile" class="button">Image</label> <input type="file" required id="imageFile" name="imageFile" style="display:none" /> </div>

Answer 1

刪除必需，因為顯示為無。 如果未顯示，用戶無法修改輸入的值，那么為什么需要它。

Answer 2

我找到了'hack'解決方案，謝謝@G-Cyrillus。

[type='file'] {
    opacity: 0;
    position: absolute;
    width: 0;
    left: 0;
}

所需的警報工作正常。