Html 克隆CSS样式的文件上载按钮

我使用CSS设计了一个

。当我点击

+

按钮时，它将被克隆。但是，这仅在使用未设置样式的上载按钮时才会在视觉上发生

提示：为了用样式化按钮替换标准按钮，我设置了

input[type=“file”]{display:none}

。注释这一行，克隆的上传按钮变得可见，但是没有样式

有没有办法克隆CSS样式的按钮

---

请参见

您根本没有设置

输入的样式，而是设置
标签的样式，然后只克隆输入。还可以尝试克隆标签。
您根本没有设置
输入的样式，而是设置
标签的样式，然后只克隆输入。还可以尝试克隆标签。
除了
输入
之外，还需要克隆
标签

这将克隆第一个
标签
，同时确保它可以使用自己的
输入
：

$('label').first()
  .clone(true)
  .attr('for','img'+addcounter)
  .insertBefore($('#add'));

除了
输入
之外，您还需要克隆
标签

这将克隆第一个
标签
，同时确保它可以使用自己的
输入
：

$('label').first()
  .clone(true)
  .attr('for','img'+addcounter)
  .insertBefore($('#add'));

重新配置HTML，然后克隆标签
表单元素，如
input
可以是
label
elements（）的子元素，这样做将更容易用一条语句克隆这两个元素

下面，我这样做，然后将
id
属性分配给父标签，以便于确定目标

<label id="img1" class="uploadbutton">Choose File
    <input type="file" name="img1"/>
</label>

td{
宽度：100px；
}
输入[type='file']{
显示：无；
}
#img2{
颜色：红色；
}
#img3{
颜色：蓝色；
}
.上传按钮{
右边距：25px；
填充：6px 15px 6px 15px；
游标：默认值；
颜色：#000；
字体大小：15px；
文本对齐：居中；
边框：1px实心#000；
边界半径：20px；
}

选择文件
+
重新配置HTML，然后克隆标签
表单元素，如
input
可以是
label
elements（）的子元素，这样做将更容易用一条语句克隆这两个元素

下面，我这样做，然后将
id
属性分配给父标签，以便于确定目标

<label id="img1" class="uploadbutton">Choose File
    <input type="file" name="img1"/>
</label>

td{
宽度：100px；
}
输入[type='file']{
显示：无；
}
#img2{
颜色：红色；
}
#img3{
颜色：蓝色；
}
.上传按钮{
右边距：25px；
填充：6px 15px 6px 15px；
游标：默认值；
颜色：#000；
字体大小：15px；
文本对齐：居中；
边框：1px实心#000；
边界半径：20px；
}

选择文件
+
我想你可能想适应
type=“file”
我想你可能想适应
type=“file”
克隆标签，这就是线索。这正是我想要的。非常感谢！事实上，比起我自己的答案，我更喜欢@gfullam的答案。将
输入
作为
标签
的子项可以极大地简化事情。克隆标签就是线索。这正是我想要的。非常感谢！事实上，比起我自己的答案，我更喜欢@gfullam的答案。将
输入
作为
标签
的子项，大大简化了工作。同意@WurestBrtStREST，考虑把你接受的答案从我的帖子移到这个帖子。我的感情不会受到伤害；）同意@WurestBrtStREST，考虑把你接受的答案从我的帖子移到这个帖子。我的感情不会受到伤害；）