• ASP.NET后台输出js大全,页面顶部、form表单中前面与后面、和UpdatePanel(ScriptManager、AJAX)输出JS


    Response.Write 与   Page.ClientScript.RegisterStartupScript 与 Page.ClientScript.RegisterClientScriptBlock 之间的区别

    方法1,使用Response.Write,这种方法会把JS代码写在页面的最顶部(<html>的前面):
    System.Web.HttpContext.Current.Response.Write("<script language=javascript>alert(JS代码);</script>");

     

    方法2,使用RegisterStartupScript,这种方法会把JS代码嵌入在页面的底部、表单的最后 (</form>前面),适用于要在页面控件加载完成后运行的JS代码 :
    System.Web.UI.Page page = (System.Web.UI.Page)System.Web.HttpContext.Current.Handler;
    if (!page.ClientScript.IsStartupScriptRegistered(page.GetType(),"clientScript"))
        page.ClientScript.RegisterStartupScript(page.GetType(), "clientScript", "<script language=javascript>alert(JS代码);</script>");

     

    方法3,使用RegisterClientScriptBlock,这种方法会把JS代码嵌入在页面的顶部、表单的最前 (<form>后面),适用于要在控件加载前执行的JS代码,类似于上面的Response.Write方式 :
    System.Web.UI.Page page = (System.Web.UI.Page)System.Web.HttpContext.Current.Handler;
    if (!page.ClientScript.IsClientScriptBlockRegistered(page.GetType(),"clientScript"))
        page.ClientScript.RegisterClientScriptBlock(page.GetType(), "clientScript", "<script language=javascript>alert(JS代码);</script>");

     

      那么,方 法2和方法3之间有何不同呢?主要区别在于,RegisterStartupScript 方法是将 JavaScript 嵌入到 ASP.NET 页面的底部,恰好位于关闭元素 </form> 的前面。RegisterClientScriptBlock 方法是将 JavaScript 嵌入到页面中开启元素 <form> 的紧后面。那么,这有何不同呢?正如我们将要看到的,这有很大的不同。

    就此列举一例,以下是在页面加载到浏览器时,将焦点置于该页面上的一个文本框中的方法 - 使用利用了 RegisterStartupScript 方法的 Visual Basic:

    Page.ClientScript.RegisterStartupScript(Me.GetType(), "Testing", _   "document.forms[0][TextBox1].focus();", True)由于在浏览器运行到页面底部并执行此小段 JavaScript 时,就已生成了页面上的文本框,并已将其放到了页面中,因此,此方法运行正常。但是,如果不按照上述方法,而编写如下代码(使用 RegisterClientScriptBlock 方法):

    Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "Testing", _ "document.forms[0][TextBox1].focus();", True)文本框控件将不会获得焦点,且会在页面上生成一个 JavaScript 错误。

     

    Page

    大家都知道向客户端输出内容的方式很多,而打多少初学者会使用Respone.Write(string)。比如:

    Respone.Write(“hello word!”);

    或输出JS

    Respone.Write("<script type='text/javascript'>alert('hello word!');</script>");

    但是,当你查看客户端源码时,你会发现,输出的内容呈现在源码的最前端,显然它破坏了HTML的格式,在某些情况下这是会影响到页面布局等效果的。

    正确的输出方式应该是:this.ClientScript.RegisterStartupScript或this.ClientScript.RegisterClientScriptBlock.

    this.ClientScript.RegisterStartupScript 是在Form开始的第一行注册脚本,后者则是在Form结尾处注册脚本。这样就不回破坏HTML得格式了,如:

    this.ClientScript.RegisterStartupScript(this.GetType(), "scriptKey", "<script type='text/javascript'>alert('hello word!');</script>")

    this.ClientScript.RegisterStartupScript(this.GetType(), "scriptKey", "alert('hello word!');",True)

    this.ClientScript.RegisterClientScriptBlock也类似。

    UpdatePanel

    当你想在UpdatePanel内输出一段JS时,运用以上方法就会得不到预期的效果。那么请看一下示例。

    有一个UpdatePanel的ID是upPn

    System.Web.UI.ScriptManager.RegisterClientScriptBlock(upPn,this.GetType(), "scriptKey", "alert('hello word!');",True)

    System.Web.UI.ScriptManager.RegisterStartupScript(upPn,this.GetType(), "scriptKey", "alert('hello word!');",True)

    这样的话,当UpdatePanel内容加载到客户端后,就会弹出“hello word!”对话框。

    这样的话,从后台输出JS就更加方便了。

     报错错误例:

    消息: Sys.WebForms.PageRequestManagerParserErrorException: 未能分析从服务器收到的消息。

    首先不能与这类AJAX控件共存
    <RadAjax:RadAjaxManager ID="RadAjaxManager1" runat="server">
                <AjaxSettings>
                    <RadAjax:AjaxSetting AjaxControlID="Button1">
                        <UpdatedControls>
                            <RadAjax:AjaxUpdatedControl ControlID="rcaldate" />
                            <RadAjax:AjaxUpdatedControl ControlID="rcbsex" />
                            <RadAjax:AjaxUpdatedControl ControlID="rtxtmemberid" />
                            <RadAjax:AjaxUpdatedControl ControlID="rcbxiaoshouyuan" />
                            <RadAjax:AjaxUpdatedControl ControlID="rtxtlastjifen" />
                            <RadAjax:AjaxUpdatedControl ControlID="rtxtlastjfmoney" />
                            <RadAjax:AjaxUpdatedControl ControlID="rcbprice" />
                            <RadAjax:AjaxUpdatedControl ControlID="rcbvip" />
                            <RadAjax:AjaxUpdatedControl ControlID="rtxtfangjia" />
                        </UpdatedControls>
                    </RadAjax:AjaxSetting>
                </AjaxSettings>
            </RadAjax:RadAjaxManager>
    
    在用Response.Redirect()或Response.Write()进行URL带参数的页面重定向时出现如题所示的错误。
    1:Ajax是无刷新的,而使用Response进行带参重定向时需要刷新页面。所以只须在UpdatePanel下设置“asp:PostBackTrigger”的“ControlID”为指定的控件名称即可,如:  
    <Triggers>  
    <asp:PostBackTrigger ControlID="btnSave" />  
    </Triggers>
    
    2:如果你用的是微软的ajax框架,弹出提示框应该用:  
    ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.GetType(), "updateScript", "alert('对不起,账号和密码错误');", true);  
    
    3:EnableEventValidation="false"

    System.Web.UI.ScriptManager.RegisterClientScriptInclude 后台加载JS文件

      string _RootPath = HttpContext.Current.Request.ApplicationPath;
                    // Define the name, type and url of the client script on the page.
                    String csname = "ButtonClickScript";
                    String csurl = _RootPath + "script_include.js";
                    Type cstype = this.GetType();
    
                    // Get a ClientScriptManager reference from the Page class.
                    ClientScriptManager cs = Page.ClientScript;
    
                    // Check to see if the include script exists already.
                    if (!cs.IsClientScriptIncludeRegistered(cstype, csname))
                    {
                        cs.RegisterClientScriptInclude(cstype, csname, csurl);
                    }

     

    asp.net中使用updatepanel 来实现异步导致js无效

    asp.net做网站,为了简单,ajax直接使用了updatepanel来处理,结果updatepanel中的js效果,第一次加载是有效的,一旦updatepanel中使用了异步事件,js就无效了。网上找了一些答案,还是有效的。分享一下。

     因为Updatapanel没有postback,你的js不会重新加载。所以失效。你在你的页面加一段这样的代码就可以了: <script type="text/javascript" language="javascript">     

    var prm = Sys.WebForms.PageRequestManager.getInstance();     

    prm.add_endRequest(function () {         

    // re-bind your jquery events here

          $(document).ready(function(){       

                    //页面中需要处理的js代码

             });    

        }); 

    </script>

    上面这个问题,能解决自己编写的js(类似函数调用),但有些效果是直接通过引用外站提供的js代码,并没有任何调用(应该在引入的js脚本中实现了调用),上面的就没法处理了。

    没有办法的办法,就是页面多写几个updatepanel,把有js的部分跳过。

    其它方法:

    /*方法一、*/
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
         <input src="../../../images/ico/ico_delete.gif" onload="reBindDatepicker()" style="display: none" id="Image1" type="image" />
     </ContentTemplate>
    </asp:UpdatePanel>
    
    
    <script type="text/javascript">
        function reBindDatepicker() {
            $(document).ready(function() {
                 //...
            });
        }
    </script>
    
    /*方法二、*/
    $(document).ready(function() {
        // bind your jQuery events here initially
    });
    
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    
    prm.add_endRequest(function() {
        // re-bind your jQuery events here
    });

    the solution is from :
    http://elves.cnblogs.com/

    消息: Sys.WebForms.PageRequestManagerParserErrorException: 未能分析从服务器收到的消息。

  • 相关阅读:
    为什么前后端分离了,你比从前更痛苦?
    HTML命名规范
    常用一屏自适应布局(一)
    CSS-网站导航栏标题之间的分隔符
    React-setState源码的理解
    如何在React-Native上使用Typescript
    immutable-js基础
    stylus 移动端边框1像素问题解决方案
    react native ts环境搭建
    react结合ts与mobx环境搭建步骤详解
  • 原文地址:https://www.cnblogs.com/elves/p/3757042.html
Copyright © 2020-2023  润新知