是否可以以这种方式发送文件对象?

时间:2017-08-26 04:07:15

标签: javascript jquery

我是jquery的初学者。我正在尝试发送一个我得到的File对象                 我的HTML:

public void test() {
    // Use a custom HtmlUnitDriver
    WebDriver hd = new MyHtmlUnitDriver(BrowserVersion.FIREFOX_52, true);
    WebDriverWait wait = new WebDriverWait(hd, 10);

    hd.get("https://www.tribalwars.net/");
    hd.findElement(By.id("user")).clear();
    hd.findElement(By.id("user")).sendKeys(username);
    hd.findElement(By.cssSelector("div.right.login > div.wrap")).click();
    hd.findElement(By.id("password")).clear();
    hd.findElement(By.id("password")).sendKeys(password);
    hd.findElement(By.cssSelector("a.btn-login")).click();

    // Add Wait here 
    wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("span.world_button_active")));
    hd.findElement(By.cssSelector("span.world_button_active")).click();

这是我的JavaScript:

 <label for="photo" class="col-xs-2">Photo</label>
 <input id="photo" name="fileName" type="file" class="col-xs-4"/>

我不想使用新的FormData()或iFrame。

任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:1)

 <form>
 <label for="photo" class="col-xs-2">Photo</label>
 <input id="photo" name="fileName" type="file" class="col-xs-4"/>
 </form>
$('form').on('submit', uploadFiles);

// Catch the form submit and upload the files
 function uploadFiles(event)
{
  var file = $('#photo')[0].files[0];
    console.log(file);
    var Jsondata = { name: name, dob: dob,fname: fname,mob: mob,mName: mName, Email: Email, NID: NID,password: password,District: District,Thana: Thana,gender: gender,file: file }; 
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening

    // START A LOADING SPINNER HERE

    // Create a formdata object and add the files
    var data = new FormData();
    $.each(Jsondata , function(key, value)
    {
        data.append(key, value);
    }); 

     $.ajax({
            url: 'singleUpload',
            type: 'POST',
            data: data,
            cache: false,
            dataType: 'json',
            processData: false, // Don't process the files
            contentType: false, // Set content type to false as jQuery will tell the server its a query string request
            success: function(data, textStatus, jqXHR)
            {
                if(typeof data.error === 'undefined')
                {
                    // Success so call function to process the form
                    submitForm(event, data);
                }
                else
                {
                    // Handle errors here
                    console.log('ERRORS: ' + data.error);
                }
            },
            error: function(jqXHR, textStatus, errorThrown)
            {
                // Handle errors here
                console.log('ERRORS: ' + textStatus);
                // STOP LOADING SPINNER
            }
        });
    }

答案 1 :(得分:-1)

 var data = { name: name, dob: dob,fname: fname,mob: mob,mName: mName, Email: Email, NID: NID,password: password,District: District,Thana: Thana,gender: gender,file: file };
 $.ajax({url: "singleUpload",
                type: "POST",
                data:JSON.stringify(data),
                 dataType: 'json',
                contentType: 'application/json; charset=utf-8',
                success: function (response) 
                {
                $("#academic").html(response);
                console.log("ajax ok");
                }    
 });

您可以使用此数据传递对象:JSON.stringify(数据)