如何添加输入类型"file"在新的一排

How do I add input type "file" in a new row?

本文关键字：quot 一排 何添加 输入 类型 添加 file      更新时间：2023-09-26

当用户在表中添加一行时，应该在每一行的"Image"列下显示输入"file"功能，以便用户可以为每一行选择一个文件。但是，当我添加一行时，它不显示行内的文件输入。

下面是html代码: 
   <table id="qandatbl" border="1">
    <tr>
        <th class="image">Image</th>
    </tr>
    </table>
下面是jquery代码 
function insertQuestion(form) {   
        var $tr = $("<tr></tr>");
        var $image = $("<td class='image'></td>");
        function image(){
        var $this = $(this);
        var $imagefile = $("<input type='file' name='imageFile' id='imageFile' />").attr('name',$this.attr('name'))
                         .attr('value',$this.val())
            $image.append($imagefile);
        };
        $tr.append($image);
        $('#qandatbl').append($tr);

    }

我没有看到对内部函数image()的调用。为什么会有这样的内函数呢?

类似这样，但我的问题是，什么是this ?由于您当前生成的函数在以后的任何操作中都不会使用，因此我当前删除了该函数，但无法弄清楚$(this).val()会产生什么结果。

你也传递了一个form参数，但不使用它?

 function insertQuestion(form) {   
    var $tr = $("<tr></tr>");
    var $image = $("<td class='image'></td>");

    var $imagefile = $("<input type='file' name='imageFile' id='imageFile' />").attr('name',$this.attr('name'))
                     .attr('value',$(this).val())
                     .appendTo($image);

    $tr.append($image);
    $('#qandatbl').append($tr);
}

您当前的代码段看起来很混乱。试试这个:http://jsfiddle.net/66qAR/

<form id="idOfTheForm" action="?" method="post"> 
<table border="1">
    <tr>
        <th class="image">Image</th>
    </tr>
</table>
</form>

和这个javascript:

function insertQuestion(form) {
    var imageField = $('<input />')
        .attr({
            type: 'file',
            name: 'imageFile',
            id: 'imageFile'
        });
    $(form).find('table').append($('<tr />').append(imageField));
}
insertQuestion($('#idOfTheForm'));
相关文章：