将 javascript 事件添加到输入复选框以在代码隐藏 asp.net 中执行，答案

【问题标题】：Add javascript event to input checkbox to execute in codebehind asp.net,将 javascript 事件添加到输入复选框以在代码隐藏 asp.net 中执行，
【发布时间】：2014-09-13 18:10:00
【问题描述】：

我在 aspx 页面中有一个 html 控件。

  <input type="checkbox" name="Booking" id="chkBooking" class="css-checkbox" runat="server" /><label for="chkBooking" class="css-label">Booking</label>

我想在单击复选框时添加一个 javascript 事件，并在代码隐藏中执行该事件，就像我在网上找到的这个例子：

TextBox1.Attributes.Add("onkeyup", displayControlName + 
    ".innerText=this.value.length;");

如何在后面的代码中也调用该事件？

【问题讨论】：

aspx页面背后的代码
仍然不清楚，当用户选中/取消选中checkbox时，预期的结果应该是什么？
当用户点击 html 复选框时，我希望在 aspx 页面后面的代码中执行一个方法。
在html控件“runat="server"”中，这是干什么用的。
我把它放了，所以我可以在 aspx 页面后面的代码中看到控件。

标签： javascript asp.net events

【解决方案1】：

您可以在选中的事件上添加 javascript

if(chkBooking.Checked)
{
    String scriptText = String.Empty;
    scriptText += "function ShowAlert(){";
    scriptText += "  alert( " + 
        " document.forms[0].TextBox1.value";
    scriptText += ")}";

    ClientScript.RegisterClientScriptBlock(this.GetType(), 
       "CounterScript", scriptText, true);
 }

希望这会有所帮助。

【讨论】：

我只想在单击输入复选框时调用一个代码隐藏 asp.net 事件方法。
@user3816931 : 那你为什么在 js 中标记这个问题

【解决方案2】：

不太明白这个问题。您可以在 asp.net Checkbox 上设置 AutoPostback="true" 并设置其 onCheckedChanged 事件。

<asp:CheckBox id="cb" OnCheckedChanged="cb_CheckedChanged" AutoPostBack="true" runat="server">

并且，在后面的代码中

protected void cb_CheckedChanged(object sender, EventArgs e)
{
//do whatever you want
}

当然，如果你愿意，你可以连接一个 javascript 事件来点击一个按钮 - 但是当它已经有能力进行回发时，为什么还要这样做呢？

<input type="checkbox" onclick="submitit()">
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Height="0" Width="0" CssClass="hidden" />

<script type="text/javascript">
function submitit()
{
document.getElementById('btn').click();
}

然后，当复选框被点击时，javascript函数点击按钮，页面回发和btn_Click运行。

protected void btn_Click(object sender, EventArgs e)
{
//do whatever you want
}

【讨论】：

是的，但我想使用 html 控件，因为在 html 控件中我可以应用 css，而不是在 asp 复选框中
@user3816931，您也可以在 asp 控件中应用 css。尝试使用“CssClass”属性。
它不工作，有没有办法只触发 html 输入复选框的代码隐藏事件？
您绝对可以使用 CssClass 属性将 CSS 属性应用到 asp 复选框，如上所述。如果它是一个 html 复选框，为什么不运行一个 javascript 函数来提交一个隐藏按钮？我正在编辑上面的答案。

【解决方案3】：

创建一个 asp:HiddenField（在本例中 ID 为 hiddenField）并使用下面的 jQuery 代码获取复选框值：

它对我有用。你可以从这个问题中查看更多[问题]Get checkbox value in jQuery

$('#chkBooking').click(function (e) {
    e.preventDefault();            
        $('#hiddenField').val($('#chkBooking').val());
    $("form").submit();
        });

【讨论】：

【解决方案4】：

首先，如果您想在按钮单击时调用服务器端函数，那么为什么不使用服务器端按钮控件并在按钮的 OnClick 事件触发时调用所需的函数。

YourPage.aspx

<asp:Button runat="server" ID="BigButton" OnClick="BigButton_Click" Text="Big Button" />

YourPage.aspx.cs

protected void BigButton_Click(object sender, EventArgs e)
    {
        //Call your function from here
    }

注意： 您可以使用 CssClass 属性在服务器端控件上添加 css。

<asp:Label CssClass="bingo" ID="displayLabel" runat="server" />

或者试试这个答案：

How to call a C# function from javascript?

【讨论】：