在Firefox/IE上隱藏元素並僅在Chrome上顯示

我正在使用<input type="file" webkitdirectory>在Chrome上選擇文件夾。雖然我知道此功能僅適用於Chrome，但我想隱藏此按鈕，但不支持Firefox和IE等瀏覽器。在Firefox/IE上隱藏元素並僅在Chrome上顯示

我發現了一個帖子，建議做類似下面的代碼，但它在chrome和FF上都返回false。

$scope.isDirSupp = function() { 
    var tmpInput = $('#bulkyFolder'); 
    if ('webkitdirectory' in tmpInput 
     || 'mozdirectory' in tmpInput 
     || 'odirectory' in tmpInput 
     || 'msdirectory' in tmpInput 
     || 'directory' in tmpInput) return true; 

    return false; 
}

HTML： <input type="file" webkitdirectory id="bulkyFolder" ng-show="isDirSupp">

什麼是顯示在Chrome此按鈕隱藏在Firefox和IE的最佳方式？

來源

2015-08-21 Mustang

您可以使用CSS僅在Chrome上顯示輸入元素。

#bulkyFolder { 
 
    display: none; 
 
} 
 
#bulkyFolder:not(*:root) { /* Supports only WebKit browsers */ 
 
    display: block; 
 
}

<input type="file" webkitdirectory id="bulkyFolder" ng-show="isDirSupp">

來源

2015-08-21 13:09:06

謝謝！像魅力一樣工作。 – Mustang

歡迎您:)將此問題標記爲CSS，因爲接受的答案是相關的。 –

讀How to detect Safari, Chrome, IE, Firefox and Opera browser?

它的瀏覽器檢測技術，演示，這樣做的方式。他已經解釋過，如果它是一個特定的瀏覽器，將布爾變量設置爲true。所以你可以訪問它並在特定的瀏覽器上單獨顯示特定的內容。

如：var isChrome = !!window.chrome && !isOpera;

這將設置可變isChrome

現在，如果isChrome設置可以動態創建Java腳本和顯示的內容。

來源

2015-08-21 13:33:01

在Firefox/IE上隱藏元素並僅在Chrome上顯示

回答

相關問題