是否可以在外部 javascript 文件中插入我的尖括号百分比等于 <%= %> 语法？

Posted 2023-05-08

【中文标题】是否可以在外部 javascript 文件中插入我的尖括号百分比等于 <%= %> 语法？

【英文标题】：Is it possible to interpolate my angle bracket, percent, equals <%= %> syntax in external javascript files?

【发布时间】：2010-09-14 15:53:22

【问题描述】：

在将 jQuery 与 asp.net 混合时，我经常需要在 jQuery 选择器中使用 asp .net 尖括号百分比 语法。

如果我想将 javascript 与标记分离到不同的文件中，是否还有一种方法可以评估我的 JavaScript 文件，以便在到达客户端浏览器之前插入尖括号百分比？

【参考方案1】：

如果您想将 <% code blocks %> 评估为 JavaScript 文件中的 ASP.NET 代码，您只需将 JavaScript 放在 ASPX 文件中并从 SCRIPT 元素中引用它。

script.js.aspx:

function hideElements()
  <% foreach(var elementId in Request.QueryString["hide"].Split(',')  %>
   jQuery('#' + <%= elementId %>).hide('slow');
   <%  %>
 

page.aspx:

<script src="script.js.aspx?hide=<%= GetElementsIds() %>"
        type='text/javascript'></script>

page.aspx.cs:

public string GetElementIds() 
 
   return string.Join(",", new []control1.ClientID, control2.ClientID);
 

【讨论】：

不错的小提示！

你可能想用 .ashx 代替 - 它比 .aspx 更轻

哦，我还将内容类型设置为纯文本/文本

一个 ashx 不解析 为什么是纯文本（应该是纯文本/纯文本）？使用文本/javascript。

请注意，允许将客户端提供的内容直接注入 Javascript 并不是一个好主意。您应该确保该值经过验证。

【参考方案2】：

不，您需要重构 JavaScript 以接受该信息作为参数。

所以，而不是

jQuery('#<%=MainPanel.ClientId%>').hide('slow');

做这样的事情：

function hidePanel(panelId) 
        jQuery('#' + panelId).hide('slow');

你可以从你的页面调用

hidePanel('<%=MainPanel.ClientId%>');

【讨论】：

这仍然需要混合 javascript 和标记。我试图避免。我使用 jQuery 的 $(document).onReady 事件来连接我的其他处理程序，从而消除了混合标记和脚本的需要。

【参考方案3】：

我尝试将搜索网格用户控件上的 javascript 与 .ascx 文件中的 html 分开。在第一次迭代中，我使用了 jQuery(document).onReady 函数来附加我的初始化。

问题在于 jQuery 选择器中使用的 标记未正确插入，并且在 jQuery 选择器中找不到 javascript 所作用的控件。

接下来，我尝试在 Page 初始化中创建一个 json 对象，并使用 asp.net 方法 Page.ClientScript.RegisterClientScriptBlock 将其写出来。这工作正常，但有缺点：在 asp.net 文件和 javascript 文件中硬连接 json 对象的名称和键。这是不利的，因为现在存在“两个事实点”需要维护，而且在最终呈现的页面中还存在名称冲突的可能性。

在 asp .net 中并利用 jQuery 的最优雅的解决方案是在 javascript 中创建 ajax 脚本行为。然后在 asp 代码隐藏中，在 IScriptControl 接口的 GetScriptDescriptors() 方法中注册脚本行为的属性，将服务器端控件的 ClientID 作为属性添加到脚本描述符中。

// Ajax Javacsript Code below:

Type.registerNamespace('SearchGrid');

// Define the behavior properties
//
ButtonBehavior = function() 
    ButtonBehavior.initializeBase(this);
    this._lnkSearchID = null;


// Create the prototype for the behavior
//
//
SearchGrid.ButtonBehavior.prototype = 
initialize: function() 
    SearchGrid.ButtonBehavior.callBaseMethod(this, 'initialize');
    jQuery('#' + this._lnkSearchID).click(function()  alert('We clicked!'); );
,

dispose: function() 
    SearchGrid.ButtonBehavior.callBaseMethod(this, 'dispose');
    jQuery('#' + this._lnkSearchID).unbind();
    


// Register the class as a type that inherits from Sys.Component.
SearchGrid.ButtonBehavior.registerClass('SearchGrid.ButtonBehavior', Sys.Component);


if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

---

Asp .Net 代码如下：

    public partial class SearchGrid : System.Web.UI.UserControl, IScriptControl
            
        // Initialization    
        protected override void OnPreRender(EventArgs e)
        
            if (!this.DesignMode)
            
                // Test for ScriptManager and register if it exists
                ScriptManager sm = ScriptManager.GetCurrent(Page);    
                if (sm == null)
                    throw new ApplicationException("A ScriptManager control must exist on the current page.");    
                sm.RegisterScriptControl(this);
                
            base.OnPreRender(e);
        
        protected override void Render(HtmlTextWriter writer)
        
            if (!this.DesignMode)
                sm.RegisterScriptDescriptors(this);

            base.Render(writer);
        

        // IScriptControl Members
        public IEnumerable<ScriptDescriptor> GetScriptDescriptors()
        
            ScriptBehaviorDescriptor desc = new ScriptBehaviorDescriptor("SearchGrid.ButtonBehavior", this.ClientID);         
            desc.AddProperty("lnkSearchID", this.lnkSearch.ClientID);
            yield return desc;
        

        public IEnumerable<ScriptReference> GetScriptReferences()
        
            ScriptReference reference = new ScriptReference();
            reference.Path = ResolveClientUrl("SearchGrid.ButtonBehavior.js");
            return new ScriptReference[]  reference ;
               
    

---

这里的优点是，您可以创建独立的可重用控件，其 JavaScript 行为包含在其自己的单独文件（或作为 Web 资源）中，同时传递状态和上下文，否则可能会使用角度、百分比、等于语法进行插值，这是 jQuery 完成工作所必需的。

【参考方案4】：

您还可以将 .js 文件作为 .aspx 文件处理；这样，您在编辑它们时就不会丢失智能感知和代码格式。只需将其添加到 web.config：

<system.webServer>
    <handlers>
       <add name="Dynamic JS" path="*.js" verb="*" type="System.Web.UI.PageHandlerFactory" resourceType="Unspecified"/>

【讨论】：

这样做的问题是，当您需要的只是一些静态文件时，所有 .js 文件都会创建一个 Page 对象。

Marxidad 是不是已经连接到 PageHandlerFactory 的 .aspx 文件也创建了一个 Page 对象？

是的，但是如果您只将它用于需要它的 javascript 文件，那么它还不如对每个 .js 文件都这样做。