0

我正在使用 ASP.NET 制作多文件上传器，并且我知道 IE 不支持multiple内部属性<input type="file"/>。

所以我写了一个jQuery代码来检查用户是否使用IE。如果是，则显示一个按钮，让用户添加多个文件上传控件，这样他也可以上传多个文件。

问题是，当用户单击该链接以生成<input/>控件，然后再次单击以添加第三个控件时。什么都没发生！.. 只添加了一个控件，因此可以使用两个控件。不多，无论他点击多少，都不会<input/>添加更多控件。

这是我的代码：

$(function () {
    if (!('multiple' in document.createElement('input'))) {
        var add_btn = $("<a href='#'>Add more photos</a>").insertAfter("#ContentPlaceHolder1_upload_lbl");
        var upload_pnl = $('<input type="file" runat="server"/>');
        var upload_holder = $("#fileinput_placeholder");
        add_btn.on("click", function () {
            upload_holder.append(upload_pnl);
            alert("click event called(debugging)");
        });
    }
});

这是该部分的节点树的图片：

在此处输入图像描述

4

2 回答 2

2

在您附加的点击事件上upload_pnl，每次连续点击您都附加相同的元素，因此您只会得到 2。

要添加更多内容，您需要在 click 事件回调中创建元素，或者使用类似jquery clone函数的东西来创建一个新元素。

var upload_pnl = $('<input type="file" runat="server"/>');
var upload_holder = $("#fileinput_placeholder");
add_btn.on("click", function () {
    upload_pnl.clone().appendTo(upload_holder);
    alert("click event called(debugging)");
});

同样正如 fscan 指出的那样， runat="server" 不会使这个新元素在后面的代码中可访问，因为页面现在是客户端。

于 2013-01-16T02:35:52.197 回答
2

首先，每次使用 append 插入新元素时都必须创建一个新元素。Append 会将元素从旧的父元素中移出。其次， runat="server" afaik 是一个 asp.net 属性，在 html 中完全没有任何作用。如果您使用 javascript 创建元素，则必须自己进行发布和填充。

于 2013-01-16T02:41:43.247 回答