在web中js实现类似excel的表格控件

Execl功能非常强大，内置的很多函数或公式可以大大提高对数据的加工处理能力。那么在web中有没有类似的控件呢？经过一番搜寻，发现handsontable具备了基本的excel功能支持公式，同时能对数据进行实时编辑。另外支持拖动复制、Ctrl+C 、Ctrl+V 等等。在浏览器支持方面，它支持以下的浏览器： IE7+, FF, Chrome, Safari, Opera。

首先引入相关库文件，公式支持不包含在handsontable.full.js中，需要单独引入： 

在HTML中放置一个Div容器来存放handsontable控件：

在javascript代码中，首先获取div容器，然后创建表格控件： 

其中 =SUM(B5,E3)的公式是RuleJs提供的，return 1+2是自己实现的C#代码脚本，需要单击解析：

public class CSEngine : IHttpHandler {
  private static int count = 0;
  public void ProcessRequest (HttpContext context) {
    context.Response.ContentType = "text/plain";

    try
    {
      count++;
      string ret = "";
      string code = context.Request["code"].ToString();
      if (string.IsNullOrEmpty(code))
      {
        ret = "参数错误";
      }
      else
      {
        ScriptOptions options = ScriptOptions.Default
         .AddReferences(
           Assembly.GetAssembly(typeof(DBServices.DataAccess))
          )
         //.AddImports("System.Data")
         //.AddImports("System.Data.SqlClient")
         .AddImports("DBServices");
        var state = CSharpScript.RunAsync(code, options).Result.ReturnValue;
        ret = state.ToString();

        state = null;
        options = null;
      }
      Console.WriteLine(count);
      context.Response.Write(ret);
    }
    catch(Exception ex)
    {
      //error
      Console.WriteLine(count);
    }
  }

  public bool IsReusable {
    get {
      return false;
    }
  }

}

运行代码，如下：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。