jQuery，选择输入文件，并将其设置为另一个INPUT [英] jQuery, Select Input FILE and also set it to another INPUT

问题描述

网站有2个输入字段，我只选择1个字段，另一个字段不可见。现在我想将不可见对象的.val（）更改为所选内容的.val（），这样两个字段都会上传同一个文件。

如果我这样做： （'#input_file'）。change（function（）{
var fileSelect = $（this）.val（）;
$（'＃hidden_​​input_file]'）。val（fileSelect）;
console.log（fileSelect）;
}）;

我得到这个错误：
未捕获InvalidStateError：未能在'HTMLInputElement'上设置'value'属性：该输入元素接受一个文件名，该文件名可能只能通过编程方式设置为空字符串。

  $（'＃hidden_​​input_file'）解决方案

.val（fileSelect）;


这会让jQuery改变输入的值，但是 value 永远不能*用JavaScript（也不是Flash或编程方式）来改变。在全部终端用户浏览器中防止w （'blur'，function（e））{
$ b

  $（'＃hidden_​​input_file'）。 b $ b $（'＃hidden_​​input_file'）。val（'c：\passwords.txt'）; //不会工作
}）; 
  

启用要从用户计算机上传的文件URL的程序化更改将是可怕的安全问题。

*仅适用于网络上的JavaScript

The website has 2 input fields, I only select 1 field and the other one is invisible. Now I want to change the .val() of the invisible one to the .val() of the selected one, so both fields upload the same file. How does that work?

If I do this:

    $('#input_file').change(function() {
        var fileSelect = $(this).val();
        $('#hidden_input_file"]').val(fileSelect);
        console.log(fileSelect);
    });

I get this error: Uncaught InvalidStateError: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string.

解决方案

Your code is almost correct:

$('#hidden_input_file').val(fileSelect);

This will make jQuery change the value of an input. However, the value of input type="file" can never* be changed with JavaScript (nor Flash, nor any means programmatically). This is a security feature implemented in all end-user browsers to prevent websites from a trivial mischievery:

$('#hidden_input_file').on('blur', function (e) {
    $('#hidden_input_file').val('c:\passwords.txt'); // won't work
});

Enabling the programmatical change of a file URL that is to be uploaded from a user's computer would be a monstrous security issue.

*only applies to JavaScript on the web

这篇关于jQuery，选择输入文件，并将其设置为另一个INPUT的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！