How can I check if the browser supports webkitdirectory?

I am using the Google Chrome upload function in my project described here: How to use the Google Chrome 11 upload folder function in my own code?

I have a button that triggers an input field when clicked. My question is how to check if the browser supports webkitdirectory or not? so I can hide my button or alert the user to use chrome for this service.

<button>Upload Folder</button>
<input type="file" name="file[]" multiple webkitdirectory>

<script>
  $("button").click(function(e) {
    /* TODO: Detect webkitdirectory support */
    if(webkitdirectory)
      $('input').trigger('click');
    else
      alert('Use Chrome!');
  });
</script>

      

+3


source to share


2 answers


You can try Modernizr. Looks like they implemented a check for this a couple of years ago.

https://github.com/Modernizr/Modernizr/issues/674



Otherwise check the following message

How to determine the ability to select a directory in browsers?

+4


source


Based on Modernizer and this answer, I could use this function to determine if directory selection is supported:



function testFileInputDirectory() {
    var elem = document.createElement('input'),
    dir = 'directory',
    domPrefixes = [ "", "moz", "o", "ms", "webkit" ],
    prefix;

    elem.type = 'file';

    for (prefix in domPrefixes) {
      if (domPrefixes[prefix] + dir in elem) {
        return true;
      }
    }
    return false;
}

      

0


source







All Articles