使用 javascript 触发 asp:button 点击事件答案

【问题标题】：Trigger an asp:button click event using javascript使用 javascript 触发 asp:button 点击事件
【发布时间】：2018-03-24 03:47:06
【问题描述】：

我目前正在做一个项目，该项目需要在 javascript 代码中执行一系列事件后触发 asp:button 点击事件。

请在下面查看我的代码：

这是我的按钮，它是点击事件：

<asp:Button ID="btnRefresh" name="btnRefresh" runat="server" Text="btnRefresh" onclick="btnRefresh_Click" />

protected void btnRefresh_Click(object sender, EventArgs e)
{
    MyGrid.DataSource = null;
    MyGrid.DataSource = GetDataForGrid();
    MyGrid.DataBind();
}

我引用了一个 javascript 文件，该文件包含我所有的页面 javascript 代码。我这样做是因为我真的不喜欢在 .aspx 文件中混合我的 javascript 代码。

这是函数在我的外部 .js 文件中的样子：

function Refresh() {
    var btn = $(document).getElementById('btnRefresh');
    if (btn) {
        btn.click();
    }
    else {
        alert('false');
    }
}

我也尝试过在互联网上看到的其他方法如下所有这些都没有运气：

document.getElementById('btnRefresh');
__doPostBack('btnRefresh', '');
__doPostBack('btnRefresh', 'Click');
$('#btnRefresh').click();

有人可以指点我一个好方法吗？谢谢！

编辑：

我想做的是：我在 UpdatePanel 中有一个 gridview。我有一个触发器，它在单击 btnRefresh 时触发。所以基本上，它刷新了我的gridview。因此，我不能使用按钮的 OnClick 属性来调用我的 javascript 函数，因为我不会首先单击按钮。我需要能够从我的外部 javascript 调用 btnRefresh_Click 事件，以便触发我的触发器来更新我的 GridView。

编辑 2：

我尝试使用以下行在 .aspx 页面本身上定义我的btn：

var btn = $("#");

我还修改了我的 JS 代码如下：

函数刷新（）{ 如果（btn）{ btn.click(); } 别的 { 警报（'假'）； } }

js 能够看到btn 并且事件通过了btn.click() 但是，我的btnRefresh_Click 仍然没有启动。我在这里遗漏了什么吗？

【问题讨论】：

标签： javascript jquery click aspbutton

【解决方案1】：

由于您引用了 JS 文件，因此您有两个选择。要么传入按钮的ClientID，要么将按钮的ClientIDMode 设置为Static。

我建议你将id传递给JS函数。

function Refresh(id) {
    var btn = $(document).getElementById(id);
    if (btn) {
        btn.click();
    }
    else {
        alert('false');
    }
}

当你想在另一个JS函数中调用它时，传入ClientID。

function doSomthing(){
    //do this
    //do that
    Refresh('<%=btnRefresh.ClientID%>');
}

但正如你所说，如果你不喜欢将 JS 放在你的 aspx 页面中，那么只需设置你的按钮的ClientIDMode = Static。

<asp:Button ID="btnRefresh" ClientIDMode="Static" name="btnRefresh" runat="server" Text="btnRefresh" onclick="btnRefresh_Click" />

【讨论】：

但是我如何能够将ClientID 从我的 .aspx 文件传递到外部 .js 文件，而不必在我的 .aspx 文件中创建额外的 js 函数？谢谢你。
如何以及在哪里调用 Refresh js 函数？

【解决方案2】：

这里您可以使用 OnClientClick 属性并提及要调用的外部 js 中的函数名称，因为该属性实际上是在服务器端事件执行之前执行的。

【讨论】：

其实这个按钮是隐藏的。请参阅我上面的编辑。我添加了一些关于我希望我的代码如何工作的注释。感谢您的回复！ :)

【解决方案3】：

查看ClientID 属性。

您可以使用该属性获取客户端按钮的ID，并使用该ID触发点击。

function Refresh() {
    var btn = $("#<%=btnRefresh.ClientID%>");
    if (btn) {
        btn.click();
    }
    else {
        alert('false');
    }
}

但请注意<%=btnRefresh.ClientID%> 只能在与btnRefresh 相同的页面上工作，而不是在外部 JS 文件中。 ClientID 由 ASP.NET 动态生成。

【讨论】：

我也试过这个。但是，我使用的是外部 JS 文件。运气好你可能知道实现这一目标的方法吗？谢谢。
在您的页面中定义您的 javascript 按钮变量。
我试过了，但我的btnRefresh_Click 事件仍然没有触发。请参阅我上面的编辑。 :(

【解决方案4】：

这是我过去使用过的“hack”

客户端可见的按钮是

<input type="button" id="btPart1" value="Trigger Phase 1" 
    onclick="clicked()" class="btn btn-default" />

在您的网络表单中定义这样的按钮

<asp:button id="Triggered" runat="server" OnClick="btnRefresh_Click"
    Style="visibility: hidden;"/>

在你的 JavaScript 中你会拥有

function clicked(){
    document.getElementById("ctl02_Triggered").click();
}

根据您使用的 asp 版本，ID 会发生变化，因此请确保检查按钮的实际 ID，以便您可以通过 js 触发它。我提到这一点是因为在编译时 ASP 实际上会根据它所拥有的父项来转换您提供的 ID。

【讨论】：

【解决方案5】：

实际上，在运行任何 JS 方法之前，您必须确保 DOM 已加载。因此，请确保您的 js 文件包含在 DOM (html) 的末尾。

由于btnRefresh按钮是服务器控件，所以需要通过clientID在Refresh方法中引用，

var btn= document.getElementById(‘<%=btnRefresh.ClientID=%>’);

但是您的代码没有显示您是如何调用Refresh 方法的。所以希望以上对你有所帮助。或者您需要显示更多代码。

【讨论】：