0

我正在使用以下 HTML 处理自定义文件输入：

<div class="file">
  <a>browse<input type="file" name="annex"/></a>                 
  <span class="path">path</span>
</div>
<div class="help">Only PDF files allowed</div>

您可以在此处查看在线示例：http: //codepen.io/mdmoura/pen/qAvDk

问题

CSS

  • 我无法垂直对齐按钮（红色）文本和路径文本（蓝色）。我尝试为两者应用 inline-block 和相同的填充，但没有运气......我该如何解决？

查询

  • 我使用var input = $(this);但如果我使用var this = $(this);它不起作用。为什么？

  • 使用$('.path').text(label);作品......但我想在我引用的 :file 之后获得跨度......我试过input.next().text(label);但它不起作用。为什么？

谢谢你，米格尔

4

1 回答 1

1

CSS问题

在所有浏览器中都不是问题，但是如果您从跨度中删除，锚点和跨度将对齐padding，添加vertical-align: middle到锚点并删除它的负下边距。

JS 问题

this是不可变的。它不能被分配，这实际上会产生一个语法（我认为）错误

无效的左手分配

this声明或调用函数时有多种设置方式，但var input = $(this)都是常用的解决方案。我会坚持下去。

至于您的选择器，您需要使用input.parent().next(). 输入是锚的一个孩子，没有兄弟姐妹。

于 2013-10-03T10:27:48.660 回答