Question

我正在开发一个页面，允许用户上传带有HTML输入的照片：

<input id="fileUpload" runat="server" type="file"   style="visibility:hidden;" />

我已经得到它hidden因为我想通过使用<img>作为Browse按钮并使用Jquery触发fileUpload控件的click事件来设置自己的上传控件：

<img id="btnBrowse" alt="Choose an photo to upload..." src="images/browse.gif" />

JS：

$("#btnBrowse").click(function () {

 $('input[type=file]').click();

});

我使用<ASP:ImageButton>作为上传按钮，<ASP:TextBox>保存所选文件的文本。

如果删除style="visibility:hidden;"，一切正常。但有了它，当我单击上传时，文件上传控件的文件将丢失，并且在我再次单击上载之前页面将不会回发。

我知道这是一种“hack”但我不想使用<ASP:FileUpload>控件因为它无法自定义而且我不想打扰Jquery插件如果我没有人就能完成我的需要。

在保持style="visibility:hidden;"到位的情况下，有没有人经历过这个或者知道如何才能做到这一点？

非常感谢提前！

修改

它实际上似乎与我的自定义“浏览”按钮更相关。我正在使用<img>，如上所述，我尝试使用<ASP:ImageButton>，但得到相同的结果。任何时候我点击我的自定义浏览按钮（它调用JS来点击input type=file），在选择文件后，我的上传按钮将需要两次点击（并且第一次点击会清除输入的文件路径（就像它尝试一样）回帖）？

对此有何想法？

Answer 1

如果我理解正确，您可以在后面的代码中将事件附加到浏览图像。在向按钮添加多个属性时，我也做了同样的事情，即。一个onclick指向后面的代码，一个onchange指向js。

Answer 2

在黑暗中纯粹刺伤，尝试使用display:none代替visibility:hidden

Answer 3

另外，如果您已经有js文件，则可以使用以下内容：

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
         window.onload = func;
    }
    else {
        window.onload = function () {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}
addLoadEvent(whatYouWantToInit);

var whatYouWantToInit_count = 0;
function whatYouWantToInit() {
    if (whatYouWantToInit_count) { return; } // Won't let this function execute twice.
        whatYouWantToInit_count++;
        if ($('yourButton') != null) {
            $('yourButton').onclick = yourButton_click; //the function you want your onclick event to fire.
        }
}

ASP按钮需要两次点击才能回发？

3 个答案: