附加文件后动态更改回形针图标，改为显示文件图标。答案

【问题标题】：Dynamically change Icon of paper clip after a file is attached, to display a file icon instead.附加文件后动态更改回形针图标，改为显示文件图标。
【发布时间】：2018-08-23 14:35:40
【问题描述】：

我目前正在尝试在附加文档时将回形针图标动态更改为文件图标。目前我让它在悬停时显示文件名，但我想让它在附加文件时显示不同的图标。我正在使用 C# 以及 JavaScript 和 jQuery。

我有一个回形针图标，我可以单击它来附加文件。附加文件后，我希望图标从回形针变为文件图标。

<a href="javascript:void(0);" id="exception-modal-file-picker">
    <span class="widget-icon fa-2x float-right input input-file">
      <i class="fa fa-paperclip" id="paperclip"></i>
    </span>
</a>
<input type="file" class="hidden" id="fileDocument" name="fileDocument" onchange="document.getElementById('paperclip').title=value" />

上面我有回形针的代码，它允许我附加文件并悬停它会显示文件名。

$('#exception-modal-file-picker').on('click', function() {
    $('#fileDocument').click();
});

上面是我的 JavaScript。

【问题讨论】：

嗨 - 欢迎。请考虑重新发布常见问题解答和其他一些问题，以了解如何提出更具体的问题。你的问题非常模糊。这是C#吗？ HTML？ CSS？请提供代码sn-p？ :) 请编辑和更新您的问题，否则可能会立即关闭。请不要把它当作个人。谢谢你，对不起

标签： javascript jquery asp.net html

【解决方案1】：

您应该可以通过onChange 轻松做到这一点，您目前仅使用 onChange 来设置标题。您可以编写一个方法来设置标题和更改图标。

https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications

【讨论】：

谢谢，我试试看。