如何从代码隐藏调用javascript函数答案

【问题标题】：How to call javascript function from code-behind如何从代码隐藏调用javascript函数
【发布时间】：2011-01-31 07:51:10
【问题描述】：

我用 asp.net 页面编写了一个 javascript。

在 Asp.net 页面中

<HTML> <HEAD>
     <script type="text/javascript">
      function Myfunction(){
          document.getElementId('MyText').value="hi";
      }
      </script>
</HEAD> <BODY>
<input type="text" id="MyText" runat="server" /> </BODY>

在代码隐藏中

 Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
  Handles Me.Load
       If Session("My")= "Hi" Then
          I want to call "Myfunction" javascript function
       End If 
 End Sub

我该怎么办？

【问题讨论】：

How to call javascript function from code-behind 的可能重复项
您真的想从代码隐藏中调用函数，还是希望函数在页面加载时运行？我认为这是您想要的最后一个选择。

标签： javascript asp.net

【解决方案1】：

一种方法是使用ClientScriptManager：

Page.ClientScript.RegisterStartupScript(
    GetType(), 
    "MyKey", 
    "Myfunction();", 
    true);

【讨论】：

似乎最好的方法是你的，但“MyKey”是什么？
密钥只是一个唯一标识符，有助于避免两次发出相同的脚本。它可以是任何东西。
最好的解决方案，很简单
密钥应为 GUID！
如果你想让javascript函数在页面加载后执行，请看这里stackoverflow.com/a/40335689/74585

【解决方案2】：

这是一种从后面的代码调用一个或多个 JavaScript 方法的方法。通过使用脚本管理器，我们可以按顺序调用方法。以下面的代码为例。

ScriptManager.RegisterStartupScript(this, typeof(Page), "UpdateMsg", 
    "$(document).ready(function(){EnableControls();
    alert('Overrides successfully Updated.');
    DisableControls();});", 
true);

在第一个方法中，EnableControls() 被调用。接下来将显示警报。接下来将调用 DisableControls() 方法。

【讨论】：

【解决方案3】：

有一种非常简单的方法可以做到这一点。它涉及从后面的代码向标签控件注入 javascript 代码。这是示例代码：

<head runat="server"> 
    <title>Calling javascript function from code behind example</title> 
        <script type="text/javascript"> 
            function showDialogue() { 
                alert("this dialogue has been invoked through codebehind."); 
            } 
        </script> 
</head>

.......

lblJavaScript.Text = "<script type='text/javascript'>showDialogue();</script>";

在此处查看完整代码：~~http://softmate-technologies.com/javascript-from-CodeBehind.htm~~（已死）
互联网档案链接：https://web.archive.org/web/20120608053720/http://softmate-technologies.com/javascript-from-CodeBehind.htm

【讨论】：

不幸的是链接被破坏了:-(
喜欢这个解决方案——感觉就像在作弊。我怀疑它可能不适合所有场景，但我很难想到它不起作用的情况。

【解决方案4】：

如果执行顺序不重要，并且您需要一些 javascript 和一些代码隐藏来在 asp 元素上触发，那么您可以这样做。

你可以从我的例子中得到什么：我有一个覆盖 ASP 控件的 div，我希望从中运行 javascript 和代码隐藏。 div 的 onClick 方法和日历的 OnSelectionChanged 事件都以这种方式触发。

在这个例子中，我使用了一个 ASP 日历控件，并且我通过 javascript 和代码隐藏来控制它：

前端代码：

        <div onclick="showHideModal();">
            <asp:Calendar 
                OnSelectionChanged="DatepickerDateChange" ID="DatepickerCalendar" runat="server" 
                BorderWidth="1px" DayNameFormat="Shortest" Font-Names="Verdana" 
                Font-Size="8pt" ShowGridLines="true" BackColor="#B8C9E1" BorderColor="#003E51" Width="100%"> 
                <OtherMonthDayStyle ForeColor="#6C5D34"> </OtherMonthDayStyle> 
                <DayHeaderStyle  ForeColor="black" BackColor="#D19000"> </DayHeaderStyle>
                <TitleStyle BackColor="#B8C9E1" ForeColor="Black"> </TitleStyle> 
                <DayStyle BackColor="White"> </DayStyle> 
                <SelectedDayStyle BackColor="#003E51" Font-Bold="True"> </SelectedDayStyle> 
            </asp:Calendar>
        </div>

代码隐藏：

        protected void DatepickerDateChange(object sender, EventArgs e)
        {
            if (toFromPicked.Value == "MainContent_fromDate")
            {
                fromDate.Text = DatepickerCalendar.SelectedDate.ToShortDateString();
            }
            else
            {
                toDate.Text = DatepickerCalendar.SelectedDate.ToShortDateString();
            }
        }

【讨论】：

【解决方案5】：

asp:运行javascript方法

将此行添加到页面底部</form> 标记之前，至少在您编写的js 函数下方。

这样做的原因是避免在你之前调用你的方法浏览知道什么是功能，最后什么都不做。

<% Response.Write($"<script>yourfunction('{Config.id}');</script>"); %>

ps:我已经尝试了所有方法，但对我来说没有任何效果。我自己想出了这种简单而奇妙的调用js方法的方法！

【讨论】：