Axial,用.NET语言来写JavaScript代码

Axial 是CodePlex上一个开源项目，使用它我们可以以C#或VB.NET的方式来实现JavaScript功能，然后它会自动将相应的JavaScript输出到客户端。一些表单控件的输入验证、一些JS特效以及Ajax等等,我们都可以用它来实现。Axial现在还封装了jQuery，使我们可以用C#或者VB.NET来使用jQuery。

Axial包含几个服务器控件：

• WFServerScript
• WFScript
• WFValidator
• WFStartupScript
• WFClass
• Canvas
• WFScriptButton

Axial的使用很简单：

1、添加Axial.dll引用，并将其添加到Visual Studio控件工具箱中

2、在后台写相关JavaScript的.NET方法，方法必须为public

using  Axial;
using  Axial.jQuery;
using  Axial.DOM;

namespace  AxialWeb
{
     public   partial   class  jQueryTest : System.Web.UI.Page
    {
         public   void  HtmlTheDivs() {
            JQuery.jQuery( " div.empty " ).html( " in a div " );
            JQuery. get ( " viaajax.txt " ,  "" ,
                (response)  =>  { JQuery.jQuery( " div.empty:first " ).html(( string )response); });
            JQuery.jQuery( " div.notempty " ).children().html( " when two divs love each other very much " );
            JQuery.jQuery( " div.notempty " ).children().css( " padding " ,  " 3px " );
            JQuery.jQuery( " div.notempty " ).children().each(AlertPadding);
        }

         public   void  AlertPadding() {
            Window.Alert(JQuery.This.css( " padding " ));
        }
    }
}

3、在前台ASPX页面里拖一个相应的控件，设置MethodName属性

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
< head  runat ="server" >
     < title > jQuery Test </ title >
     < script  type ="text/javascript"  src ="jquery-1.2.3.min.js" ></ script >
</ head >
< body >
     < form  id ="form1"  runat ="server" >
         < div  class ="empty"  style ="border: 1px solid red;" ></ div >
         < div  class ="empty"  style ="border: 1px solid blue;" ></ div >
         < div  class ="notempty"  style ="border: 1px solid green;" >
             < div  style ="border: 1px solid purple;" ></ div >
         </ div >
        
         < asp:Button  runat ="server"  ID ="btnRun"  Text ="Run"  OnClientClick ="HtmlTheDivs(); return false;"   />
         < axial:WFScript  runat ="server"  ID ="wfsHTD"  MethodName ="HtmlTheDivs"   />
     </ form >
</ body >
</ html >

下面是自动生成的js代码 

< script  type ="text/javascript" >
// <![CDATA[
function  HtmlTheDivs()
{
    $( ' div.empty ' ).html( ' in a div ' );
     if  ( ! null )
    $.get( ' viaajax.txt ' ,  '' ,  function (arg0)
{
    $( ' div.empty:first ' ).html();
}
);
    $( ' div.notempty ' ).children().html( ' when two divs love each other very much ' );
    $( ' div.notempty ' ).children().css( ' padding ' ,  ' 3px ' );
    $( ' div.notempty ' ).children().each(AlertPadding);
}
function  AlertPadding()
{
    window.alert($( this ).css( ' padding ' ));
}
// ]]>
</ script >

Axial需要.NET Framework 3.5,关于它的详细使用，请到CodePlex下载源代码，里面包含详细的代码示例。