ASP Button 需要两次点击才能回发？答案

【问题标题】：ASP Button requires two clicks to post back?ASP Button 需要两次点击才能回发？
【发布时间】：2011-11-11 04:27:31
【问题描述】：

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

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

我得到它hidden，因为我想通过为浏览按钮使用<img> 并使用 Jquery 来触发 fileUpload 控件的单击事件来设置我自己的上传控件的样式：

<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;"，一切正常。但是有了它，当我点击上传时，文件上传控件的文件丢失了，直到我再次点击上传，页面才会回传。

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

有没有人经历过这种情况或知道如何在保持style="visibility:hidden;" 不变的情况下完成这项工作？

提前非常感谢！

编辑：

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

对此有什么想法吗？

【问题讨论】：

只是在黑暗中刺伤。你试过“显示：无”吗？
页面上是否有表单验证、asp.net验证器控件或其他？
感谢您的回复，不走运。并且有一个验证器控件 - 但它位于与此页面相关的母版页上。有什么我可以检查的吗？
尝试暂时关闭母版页上的验证器，看看这是否是问题的一部分。
我将验证器完全注释掉了，这也没有任何影响。

标签： javascript jquery button file-upload input

【解决方案1】：

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

【讨论】：

我不确定我明白你的意思吗？
他的意思是。 btnName.Attributes.Add();
我不需要将浏览按钮连接到后面的代码。浏览按钮仅模拟通过 Javascript 单击input type=file。但是，使用我的自定义浏览按钮搞砸了，因为我的上传按钮直到第二次点击才起作用。
另外，如果你已经有一个js文件，你可以使用如下：

【解决方案2】：

纯粹在黑暗中刺伤，尝试使用display:none而不是visibility:hidden

【讨论】：

【解决方案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.
        }
}

【讨论】：