如何在C#代码背后编写Javascript代码

本文关键字：代码 Javascript 背后 | 更新日期: 2023-09-27 17:51:25

我正在动态创建文本框，那么如何为文本框"onchange"事件调用下面的javascript函数呢？

<script type="text/javascript">
    debugger;
    function myFunction() {
        var btn = document.getElementById('<%= temp.ClientID%>').value;
        var btntemp = document.getElementById('<%= txttemp2.ClientID%>').value;
        var val = parseInt(btn) + parseInt(btntemp);
        document.getElementById('<%= TextBox1.ClientID%>').value = val;
    }        
</script>
<asp:TextBox ID="temp" runat="server" onchange="myFunction()"></asp:TextBox>
   <asp:TextBox ID="txttemp2" runat="server" onchange="myFunction()"></asp:TextBox>

这里是动态创建textboxex。

Table table = (Table)this.Page.FindControl("PlaceHolder1").FindControl("Table1");
for (int i = 0; i < rowsCount; i++)
 {
   for (int j = 0; j < colsCount; j++)
    {
     TextBox tb = (TextBox)table.Rows[i + 1].Cells[j].FindControl("TextBoxRow_" + i + "Col_" + j);
     tb.Text = Request.Form["TextBoxRow_" + i + "Col_" + j];

我在这里得到第一列的文本框值

else if (j == 2)
 {
   int quantityText;
   TextBox quantity = (TextBox)table.Rows[i +1].Cells[j].FindControl("TextBoxRow_" + i + "Col_" + j);

我在这里得到第二列的文本框值

else if (j == 3)
  {
    double rateText;
    TextBox rate = (TextBox)table.Rows[i + 1].Cells[j].FindControl("TextBoxRow_" + i + "Col_" + j);

这里iam动态生成文本框。

private void GenerateTable(int rowsCount)
 {
  Table table = new Table();
            table.ID = "Table1";
            PlaceHolder1.Controls.Add(table);
           for (int i = 0; i < rowsCount; i++)
            {
                TableRow row = new TableRow();
                row.ID = "Row_" + i;
                else if (j < colsCount - 1)
                    {
                        TableCell cell = new TableCell();
                        TextBox tb = new TextBox();
                      tb.ID = "TextBoxRow_" + i + "Col_" + j;
                      cell.Controls.Add(tb);
                     row.Cells.Add(cell);
                    }

如何在C#代码背后编写Javascript代码

在后面的代码中使用此函数来调用javascript函数

ClientScript.RegisterClientScriptBlock(myFunction(), "AlertMsg", "<script> 
                              alert('Inserted successfully');</script>", true)

如果您的文本框具有runat="server"属性，则需要您的脚本。我认为你的脚本需要是c#才能以这种方式工作。您可以将原来的函数重写为：

<script runat="server">
    void textBox_Change(Object sender, EventArgs e) {
        TextBox1.Text = Int32.parse(temp.Text) +                      
            Int32.parse(txttemp2.Text)
    }
</script>
<asp:TextBox ID="temp" runat="server" ontextchanged="textBox_Change" autopostback="true"></asp:TextBox>
<asp:TextBox ID="txttemp2" runat="server" ontextchanged="textBox_Change" autopostback="true"></asp:TextBox>

您的handler属性也是错误的。更改TextBox控件中文本的事件是ontextchange=""，如上面的代码框所示，还需要设置autopostback="true"。。。但只有当用户将焦点从TextBox控件移开时，它才会生效。

您还可以将jQuery用于纯javascript处理程序：

$(document).on("change","#temp,#txttemp2",myFunction);

这将检测到客户端中文本框的更改，并激发您的方法。因为它是一个委托的处理程序，所以即使项目不是在您最初注册时创建的，它也会捕获事件。你甚至可以为你的物品设置一个类，这样你就不需要知道它们的ID：

 $(document).on("change",".waitingForChangeForMyFunction",myFunction);

然后，当你生成文本框时，只需执行：

TextBox tb = new TextBox();
tb.CssClass="waitingForChangeForMyFunction";

您可以使用RegisterClientScriptBlock:

String scripts = "function myFunction(clientID) {
        var btn = document.getElementById('clientID').value;
        var btntemp = document.getElementById('clientID').value;
        var val = parseInt(btn) + parseInt(btntemp);
        document.getElementById('clientID').value = val;
    }     ";
ClientScript.RegisterClientScriptBlock(this.GetType(), 
               "CounterScript", scripts, true);    
for (int i = 0; i < rowsCount; i++)
 {
   for (int j = 0; j < colsCount; j++)
    {
     TextBox quantity = (TextBox)table.Rows[i +1].Cells[j].FindControl("TextBoxRow_" + i + "Col_" + j);
     quantity .Attributes.Add("onchange", "jsFunc('TextBoxRow_'" + i + "Col_" + j + "')");
    }
}

我成功地得到了下面的答案。脚本方必须像下面的一样编写

    <script type="text/javascript">
             function myFunction() {
                 var btn = document.getElementById('<%= TextBox1.ClientID%>').value;
                 var sum = [0, 1, 2]
                 for (var j = 0; j <= btn; j++) {
                     var elements = document.getElementsByClassName("sum"+j);
                     for (var i = 0, length = elements.length; i < length; i++) {
                         if (elements[i].value) {
                             sum[0] = parseInt(elements[0].value);
                             sum[1] = parseInt(elements[1].value);
                             sum[2] = parseInt(elements[2].value);
                         }
                         elements[2].value = sum[0] * sum[1];
                     }
                 }
             }        
    </script>
</head>
<body>
    <form id="form1" runat="server">
<div style="display:none">
    <asp:HiddenField ID="HiddenField2" runat="server" />
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    </div> </form>
</body>
</html>

在动态创建文本框时，必须添加类，我们必须获得值并计算它，然后显示结果

private void GenerateTable(int rowsCount)
        {
            //ContentPlaceHolder content = (ContentPlaceHolder)this.Master.FindControl("ContentPlaceHolder1");
            TextBox1.Text = rowsCount.ToString();
            Table table = new Table();
            table.ID = "Table1";
            PlaceHolder1.Controls.Add(table);
            for (int i = 0; i < rowsCount; i++)
            {
                TableRow row = new TableRow();
                row.ID = "Row_" + i;
for (int j = 0; j < colsCount; j++)
                {
if (j < colsCount - 1)
                    {
                        TableCell cell = new TableCell();
                        TextBox tb = new TextBox();
if (j == 2)
                        {
                            tb.ID = "TextBoxRow_" + i + "Col_" + j;
                            tb.CssClass = "sum"+i;
                            tb.Attributes.Add("onchange", "myFunction();");
                        }
                        else if (j == 3)
                        {
                            tb.ID = "TextBoxRow_" + i + "Col_" + j;
                            tb.CssClass = "sum"+i;
                            tb.Attributes.Add("onchange", "myFunction();");
                        }
                        else if (j == 4)
                        {
                            tb.ID = "TextBoxRow_" + i + "Col_" + j;
                            tb.ReadOnly = true;
                            tb.CssClass = "sum"+i;
                        }
                        cell.Controls.Add(tb);                       
                        row.Cells.Add(cell);
                    }
table.Rows.Add(row);
            }  
                SetPreviousData(rowsCount, colsCount);    
            rowsCount++;
            ViewState["RowsCount"] = rowsCount;
        }
相关文章：