列出Cordova中的android目录(Filebrowser＆Folderbrowser)

到目前为止, 还没有太多可定制的文件浏览器。例如, 此插件仅适用于android, 并且似乎已锁定为横向使用, 尽管很好地使用了第三方库和插件, 但有时你找不到很好的东西或无法满足你的要求。

注意：ourcodeworld-cordova-filebrowser插件仅为android创建本机文件和文件夹浏览器, 可在此处的官方Github存储库中使用。

由于多种因素, 例如兼容性, 自定义性和其他因素, 文件浏览器插件的想法似乎很复杂, 因此强烈建议为你的项目创建自己的文件选择器或浏览器！并使用正确的插件是一项容易完成的任务。

我们在项目中需要cordova文件插件, 实现自定义文件浏览器很重要, 你可以使用以下命令下载：

$ cordova plugin add cordova-plugin-file

现在一切都应该变成小菜一碟了！

1)检索文件夹的所有内容

首先, 我们需要了解基本代码的工作方式(记住所有代码都应在” onDeviceReady”事件上执行)：

var myPath = cordova.file.externalRootDirectory; // We can use the default externalRootDirectory or use a path : file://my/custom/folder

window.resolveLocalFileSystemURL(myPath, function (dirEntry) {
     var directoryReader = dirEntry.createReader();
     directoryReader.readEntries(onSuccessCallback, onFailCallback);
});

function onSuccessCallback(entries){
  // The magic will happen here, check out entries with :
  // console.log(entries);
}

function onFailCallback(){
  // In case of error
}

我们将使用resolveLocalFileSystemURL检索目录项, 并在数组中获取文件夹的所有内容(包括文件夹和文件)。

2)在某物上显示内容

现在出现”困难的部分”, 以你想要的方式呈现条目！

例如, 使用ul标签和简单代码制作的非常简单的文件浏览器：

的HTML

<div>
  <ul id="select-demo">
    
  </ul>
</div>

Java脚本

/**
 * This function will draw the given path.
 */
function listPath(myPath){
  window.resolveLocalFileSystemURL(myPath, function (dirEntry) {
       var directoryReader = dirEntry.createReader();
       directoryReader.readEntries(onSuccessCallback, onFailCallback);
  });

  function onSuccessCallback(entries){
       for (i=0; i<entries.length; i++) {
           var row = entries[i];
           var html = '';         
           if(row.isDirectory){
                 // We will draw the content of the clicked folder
                 html = '<li onclick="listPath('+"'"+row.nativeURL+"'"+');">'+row.name+'</li>';
           }else{
                 // alert the path of file
                 html = '<li onclick="getFilepath('+"'"+row.nativeURL+"'"+');">'+row.name+'</li>';
           }
       
       }
                
        document.getElementById("select-demo").innerHTML = html;
  }

  function onFailCallback(e){
    console.error(e);
    // In case of error
  }
}

function getFilepath(thefilepath){
        alert(thefilepath);
}

当我们调用函数listPath(” file：// storage / 0″);该文件夹的所有内容将在UL元素中呈现。嵌套的LI元素, 单击后将根据其类型, 文件夹或文件执行其操作。