我制作了一个上传文件的表格:文件,名称,扩展名(在php中连接到ms sql server)。 我想基于其扩展名为每个文件添加图标。我找到3个选项我该怎么做: 1.最好 - 以某种方式加载用户默认图标,并以某种方式将它们与我的文件连接 2.从一些网页的图标列表以某种方式加载 - 并以某种方式将它们与我的文件连接起来 3.糟糕 - 将一些图标放到我的文件夹中并从该文件中加载
我知道如何做第三个选项,但我不能只搜索10个图标,因为我的文件夹中总会有一个扩展名(就像jpeg与jpg不同)。
你能告诉我怎样才能做出更好的解决方案呢?它可以是PHP或JS / jQuery,但它并不适合。
答案 0 :(得分:2)
您必须使用默认图标来处理未知类型的文件。
您可以在表格中显示文件
<强> HTML 强>
<tr>
<td class="fm fm_file">
<a target="_blank" href="./download.php?f=something">yourfile.jpg</a>
</td>
</tr>
我的代码片段,它执行此操作(较大的库的片段)
<强> PHP 强>
if ($handle = opendir($directory)) {
while (false !== ($entry = readdir($handle))) {
if ($entry != "." && $entry != "..") {
if (!is_dir($directory . DIRECTORY_SEPARATOR . $entry)) {
$md = rand(0, 9) . substr(md5('download' . $entry), 1, 10) . rand(1000, 9999);
$dlink = '<a target="_blank" href="./download.php?f=' . $entry . '&c=' . $md . '" >' . $entry . '</a>';
$editlink='';
$a=explode('.', $entry);
if(in_array(strtolower(array_pop($a)),array('ini','txt','xml','bin','sql')))
$editlink='<a href="filemanager-edit?dir=' . $subdir.'&f=' . $entry . '&c=' . $md . '" >' . $ledit . '</a>';
$filelist.='<tr>' . '<td class="fm fm_file">' . $dlink . '</td>' . '<td class="edit">'.$editlink.'</td>' . '<td class="delete"><a href="filemanager?action=delete&dir=' . $subdir.'&f=' . $entry . '&c=' . $md . '" >' . $ldelete . '</a></td>' . '</tr>';
} else
$filelist.='<tr>' . '<td class="fm ft_folder"><a href="filemanager?action=view&dir=' . $subdir . $entry . '&c=' . md5($entry) . '" >' . $entry . '</a></td>' . '<td class="edit"></td>' . '<td class="edit"><a href="filemanager?action=view&dir=' . $subdir . $entry . '&c=' . md5($entry) . '" >' . $lchoose . '</a></td>' . '</tr>';
}
}
closedir($handle);
}
分配图标需要使用js
<强>的JavaScript 强>
$('.fm_file').each(function(){
var name=$(this).find('a').html().split('.').pop();
$(this).addClass('ft_'+name);
});
css
中图标文件的快捷方式<强> CSS 强>
.fm_file{
background-image:url(../../images/filemanager/page_white.png);
}
.ft_folder{
background-image:url(../../images/filemanager/folder.png);
}
.ft_pdf{
background-image:url(../../images/filemanager/page_white_acrobat.png);
}
.ft_cs{
background-image:url(../../images/filemanager/page_white_csharp.png);
}
.ft_xls{
background-image:url(../../images/filemanager/page_white_excel.png);
}
.ft_php{
background-image:url(../../images/filemanager/page_white_php.png);
}
.ft_dll{
background-image:url(../../images/filemanager/page_white_dll.png);
}
.ft_exe,.ft_msi{
background-image:url(../../images/filemanager/page_white_exe.png);
}
.ft_db,.ft_sql{
background-image:url(../../images/filemanager/page_white_db.png);
}
.ft_png,
.ft_jpg,
.ft_bmp,
.ft_gif{
background-image:url(../../images/filemanager/page_white_picture.png);
}
.ft_txt,
.ft_js,
.ft_ini,
.ft_bat,
.ft_css{
background-image:url(../../images/filemanager/page_white_text.png);
}
.ft_htm,
.ft_xml,
.ft_html{
background-image:url(../../images/filemanager/page_white_code.png);
}
.ft_rar,
.ft_zip{
background-image:url(../../images/filemanager/page_white_compressed.png);
}
结果:
如果有人使用未知类型,则使用类 fm_file 的图像。 您可以随时组成一组图标
答案 1 :(得分:0)
尝试这样的事情:
if(ext == 'jpg' || ext == 'jpeg')
{
$image_name = 'image.jpg';
}
if(ext == 'doc' || ext == 'docx')
{
$image_name = 'doc.jpg';
}
并为未知图标制作其他
答案 2 :(得分:0)
由于您已在数据库表中具有扩展名,因此下一个逻辑步骤是将所有公共文件扩展名加载到一个数组中,同时引用相应的图标。
然后使用in_array测试扩展程序并加载正确的图标。
您可以获得多种不同风格的文件类型的图标集。
答案 3 :(得分:0)
不幸的是,我认为没有一个简单的方法可以做到这一点,而选项3是唯一真正可行的解决方案。
我使用了与@MayankPandeyz类似的解决方案,但对图标库使用FontAwesome,并使用switch
语句选择文件扩展名。我发现switch
有点整洁,易于维护。
function getFileType(string $url):string{
$filename=explode('.',$url);
$extension=end($filename);
switch($extension){
case 'pdf':
$type=$extension;
break;
case 'docx':
case 'doc':
$type='word';
break;
case 'xls':
case 'xlsx':
$type='excel';
break;
case 'mp3':
case 'ogg':
case 'wav':
$type='audio';
break;
case 'mp4':
case 'mov':
$type='video';
break;
case 'zip':
case '7z':
case 'rar':
$type='archive';
break;
case 'jpg':
case 'jpeg':
case 'png':
$type='image';
break;
default:
$type='alt';
}
return $type;
}
<?php $url='http://example.com/downloads/file.pdf'; ?>
<div class="card blogLink-bottom download-wrapper">
<div class="card-img-top img-fluid"> <i class="fas fa-file-<?php echo getFileType($url); ?>"></i></div>
<div class="card-body blue-bg">
<h4 class="card-title bold"><?php the_title(); ?></h4>
<a href="<?php echo $url; ?>" class="btn btn-primary" download><span>Download</span></a>
</div>
</div>
以下是我们的输出示例: