Как вы заменяете весь элемент входного файла HTML другим, используя jQuery?

Question

Если вы щелкните правой кнопкой мыши на веб-странице и нажмите кнопку «View Source» в вашем веб-браузере, и вы увидите что-то вроде:

<input type="file" id="filename" name="filename" size="40/> 

и вы хотите заменить его с небольшим модифицированной версии, как:

<input type="file" id="file_0" name="file_0" size="40/><input type=hidden name="randominput" value="somevalue"> 

Как вы это сделаете в jQuery?

Я попытался следующие, не работали:

$(' <input type="file" id="filename" name="filename" size="40/>').replaceWith('<input type="file" id="file_0" name="file_0" size="40/><input type=hidden name="randominput" value="somevalue">'); 

Answer 1

Вам просто нужно что-то вроде этого:

$("#filename").parent().html("your new html here"); 

Вы должны получить родителя, потому что иначе вы бы вставить новый тег внутри Старый.

Но получая родителя, вы избавляетесь от старого тега, заменяя его новым.

Answer 2

Try:

var newInput = $('<input>'); 
newInput 
    .attr('type','file') 
    .attr('id','file_0') 
    .attr('name','file_0') 
    .attr('size','40'); 

var hiddenInput = $('<input>'); 
hiddenInputer.attr('type','hidden') 
    .attr('name','randomInput') 
    .attr('value','someValue'); 

newInput.append(hiddenInput); 
$('#filename').replaceWith(newInput);