【HTML】双击编辑字段并定位到双击的位置
一个轻量的文件名编辑组件,使用原生 JavaScript,无需任何依赖。
支持:
引入 main.js:
<script src="https://editByDoubleClick.LetMeFly.xyz/main.js"></script>
准备一个容器:
<div id="file"></div>
初始化:
new FileNameEditor(document.querySelector("#file"), {
filename: "example.txt",
size: "12.5 MB",
onChange(name) {
console.log("filename:", name);
}
});
| 参数 | 类型 | 说明 |
|---|---|---|
filename |
string |
文件名 |
size |
string |
文件大小显示文本 |
onChange |
function |
文件名修改完成后的回调 |
例如:
new FileNameEditor(document.querySelector("#file"), {
filename: "测试文件😀.txt",
size: "1.2 MB",
onChange(name) {
// 保存新的文件名
console.log(name);
}
});
组件本身不依赖任何框架,直接引入 main.js 即可使用。