文件输入我做错了什么？答案

【问题标题】：File input what am I doing wrong?文件输入我做错了什么？
【发布时间】：2013-08-10 12:10:54
【问题描述】：

我已经在这个表单上工作了一段时间，试图让一个文本字段模仿一个文件输入字段（点击它会触发隐藏文件字段打开）。我使用了一些 Javascript 来更改文本字段的值，但我无法让它工作。在这里查看http://jsfiddle.net/ygMLm/。

<script type="text/javascript">
 function getFile(){
   document.getElementById("uploaded").click();
 }
 function sub(obj){
    var file = obj.value;
    var fileName = file.split("\\");
    document.getElementById("upclicked").value = fileName[fileName.length-1];
    document.adupload.submit();
    event.preventDefault();
  }
</script>

<p><input type="text" id="upclicked" onclick="getFile()" placeholder="Select a File (960 Width JPEG)"></p>
<div style='height: 0px;width: 0px; overflow:hidden;'>
<input type="file" name="date" value="" id="uploaded" onclick="getFile()">

编辑：

$('#uploaded').change(function(){
    var file = obj.value;
    var fileName = file.split("\\");

    $('input[name=faux]').val(fileName[fileName.length-1]);
});

【问题讨论】：

哪个浏览器？我刚刚尝试过使用 Chrome，乍一看，它似乎可以满足您的需求...编辑：对不起--现在我知道您在抱怨什么...
见：stackoverflow.com/questions/16802881/…
@Diodeus - 有替代方法吗？
@EfrainAnthonyNegron 很遗憾，您将无法在大多数浏览器上触发对input[type=file] 的点击。您可以做的是将您的 invisible 文件类型元素放在文本框上。

标签： javascript jquery forms file input

【解决方案1】：

将此添加到您的 jQuery 代码中以在 DOM 上运行：

$("#uploaded").change(
  function() {
    var fullPath = $(this).val();
    var splitPath = fullPath.split("\\");
    $("#upclicked").val(splitPath[splitPath.length - 1]);
  }
);

【讨论】：

【解决方案2】：

看下面的帖子

how to fire event on file select

有关如何在file 控件上使用change() 事件的示例。您应该在此事件中放置代码以更新文本框的值。

希望对您有所帮助。

【讨论】：

不幸的是，我不是 javascript 领域的佼佼者，所以这对我来说还不够明显，无法完全掌握。我已经在 EDIT 部分尝试了上面的代码。