嗨,我是 Html 和 javascript 新手,想要一些有关如何在 Html 中实现列表容器的建议,例如当用户使用浏览 b 按钮选择其中一个文件时,这些文件应该出现在列表容器中。 如果列表容器中有一个文件,也应该默认选择它,以便我可以提供查看或删除该文件的选项。请提供一些建议/最佳实践来实现这一点。
最佳答案
这是一个使用 JQuery 的示例
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>file demo</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 4px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$( "form" ).submit(function( event ) {
event.preventDefault();
//var filename = $('#upfile').val();
//$('ipfile').html(filename);
var file = $('#ipfile')[0].files[0].name;
//$('input[type=file]')[0].files[0].name
var ip = "";
if(file){
ip=console.log(file.name);
}
$('#myTable tbody').last().append('<tr><td>' + file + '</td></tr>');
});
});
</script>
</head>
<body>
<div></div>
<div id="left_div" style="width: 600px; height: 250px;float:left; border:1px black solid; ">
<table id="myTable" >
<thead><tr><th>Files List</th></tr></thead>
<tbody>
<tr></tr>
</tbody>
</table>
</div>
<div id="right_div" style="width: 350px; height: 250px; float:left; border:1px black solid;">
<form>
<input id="ipfile" type="file">
<input id="upfile" type="submit" value="Upload" >
</form></div>
</body>
</html>
关于javascript - 如何在 html/Javascript 中实现列表容器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35471602/