在Firefox中操縱html輸入類型文件的文件名

我有一個html輸入類型的文件控件。當我選擇一個名字非常大的文件時，它會在Firefox中顯示完整的文件名，這會導致錯誤的用戶界面。是否有任何解決這個問題，如更改名稱等？在Firefox中操縱html輸入類型文件的文件名

2013-07-15 N..

你可以這樣處理：

讓你的HTML input file控制隱藏，並添加onchange事件處理程序更改選定的文件名
添加只讀 HTML textbox控制顯示改變文件名稱
添加html button控件與onclick事件處理程序觸發文件控件的單擊事件

HTML：

<input type="text" id="txtFile" readonly="true" /> 
<input type="button" id="btn" value="Browse..." onclick="browseFile();" /> 
<input type="file" id="file1" name="file1" onchange="setFileName(this.value);" />

CSS：

#file1 { 
    display: none; 
}

JS：

function browseFile() { 
    document.getElementById('file1').click(); 
} 

function setFileName(fileName) { 

    /* Manipulate file name here */ 
    fileName = fileName.substr(0, fileName.lastIndexOf('.')); 
    document.getElementById('txtFile').value = fileName; 
}

來源

2013-07-15 07:10:11 Coder

不錯........... –

這不是跨瀏覽器兼容的。你不能發送文件女巫沒有設置從IO點擊文件輸入控制。 – Saram

@Saram什麼不工作？ – Coder

有三種可能的答案，我知道：

您可以將輸入的風格大小，然後瀏覽器（在可見部分的結束與「...」）削減更長的名稱給定大小。
出於安全原因，您不能從腳本中更改文件輸入的值。觸發它的點擊事件也是一樣。所以在這種情況下的答案是否。
您可以用「pseude custom css」覆蓋整個文件輸入。這不是真正的輸入樣式，但使用一些不透明的技巧。請查看here瞭解更多詳情。

來源

2013-07-15 07:45:21 Saram

在Firefox中操縱html輸入類型文件的文件名

回答

相關問題