在文本框中插入文件名

Question

如何在现有文本输入中使用此插入文件的上传文件名 - > http://www.fengcool.com/2009/06/ajax-form-upload-local-image-file-without-refresh/或valums.com/ajax-upload/？
（我使用php）

Textbox ex。
<input name="image" type="text" value="file_name" />

Answer 1

你必须有实际的上传处理PHP页面响应上传文件的文件名。

在fengcool的AJAX，它startUpload提供（）函数：

var response = $(myFrame.contentWindow.document.body).text(); 

您使用的“响应”变量，无论你需要把文件名。

它是作为变量“图像”实际上传递给addUpload（）函数，你可以通过修改也填充您的文本框中，大约是这样的：

的document.getElementById（“图像”）值=图片

但是，您应该以不太通用的方式命名您的<input>以避免混淆。

UPDATE，做什么：

1）命名的文本框在一个更独特的方式，例如：

<input id="uploaded_image_name" type="text" value="" /> 

//另请注意，我用“身份证”，而不是“名称”为了能够使用JavaScript功能的getElementById（）

2）使用fengcool的Ajax，并更改功能addUpload（）这样的：

function addUpload(id,img){ 
    var div = $(document.createElement('div')).attr('id',id); 

    //add uploaded image 
    div.html("<img src='"+img+"'><br />"); 
    document.getElementById("uploaded_image_name").value=img 

    //add text box 
    var fileName = img.substring(img.lastIndexOf("/")+1); 
    var txtbx = $(document.createElement('input')).attr('name','img[]').attr('type','text').val(fileName); 
    /* you may want to change textbox to a hidden field in production */ 
    //var txtbx = $(document.createElement('input')).attr('name','img[]').attr('type','hidden').val(fileName); 
    txtbx.appendTo(div); 


    //add remove thumbnail link 
    var rem = $(document.createElement('a')) 
           .attr('alt',id) 
           .attr('href','javascript:;') 
           .text("Remove").click(removeUpload);  
    rem.appendTo(div); 

    //add to the page 
    div.appendTo("#uploaded_thumb"); 
} 

请注意，唯一的变化是在函数中添加了第4个命令。