(一) . 运行示例效果
* 运行后用鼠标拖动蓝色的<马>到任意位置, 将浏览器关闭后, 再重新访问本页面, 会发现<马>仍然在您拖到的位置
(二). AjaxPro.NET简介
首先对AjaxPro.NET作一下介绍, AjaxPro.NET是一个优秀的Ajax框架, 在实际应用中只要添加其DLL
引用并进行简单的配置, 即可以非常方便的在客户端直接调用服务端方法, 来获取Tree节点.
(三).使用AjaxPro.NET预配置
1. 添加 AjaxPro.dll 文件的引用(示例代码中已经包含,直接COPY过来使用即可).
2. 在Web.config文件中添加以下配置,
1 < httpHandlers > 2 < add verb = " POST,GET " path = " ajaxpro/*.ashx " type = " AjaxPro.AjaxHandlerFactory, AjaxPro " /> 3 </ httpHandlers > 3. 在要使用AjaxPro.NET框架的页面 *.aspx.cs 的 Page_Load事件中加如下代码: AjaxPro.Utility.RegisterTypeForAjax( typeof (_Default)); 4. 经过以上三步骤后, 只要在后台服务端的方法前面增加属性[AjaxMethod]后: 1 [AjaxMethod()] // or [AjaxPro.AjaxMethod] 2 public ArrayList GetSearchItems( string strQuery ) 3 { 4 // 生成数据源 5 ArrayList items = new ArrayList(); 6 items.Add( " King " ); 7 items.Add( " Rose " ); 8 return items ; 9 } 10 就可以在客户端直接使用服务端方法, 非常方便, 客户端调用后台代码如下: var returnValue = 后台代码类名.GetSearchItems(参数);(四). 代码
1. 页面前台文件 AjaxDrag.aspx 代码如下:
1 < head runat = " server " > 2 < title > Drag controls </ title > 3 < script language = " javascript " src = " dom-drag.js " ></ script > 4 </ head > 5 < body onload = " javascript:ReadPosition(); " > 6 < form id = " form1 " runat = " server " > 7 < div > 8 < table style = " width: 839px; height: 550px " 9 background = " http://blog.csdn.net/images/blog_csdn_net/chengking/XiangQi.JPG " > 10 < tr > 11 < td style = " width: 3px; height: 394px; " align = " left " atomicselection = " false " valign = " top " 12 background = " http://blog.csdn.net/images/blog_csdn_net/chengking/XiangQi.JPG " > 13 < asp:Image ID = " Image1 " runat = " server " ImageAlign = " Middle " ImageUrl = " ~/blue-ma.gif " 14 style = " cursor:hand;position:absolute;display:none " /> 15 </ td > 16 </ tr > 17 </ table > 18 </ div > 19 </ form > 20 < script language = " javascript " > 21 var Image1 = document.getElementById( " Image1 " ); 22 Drag.init(Image1); 23 Image1.onDragEnd = function(x, y) 24 { 25 WritePosition(x, y); 26 } 27 28 function WritePosition(x,y) 29 { 30 _Default.WritePosition(x, y); 31 } 32 33 function ReadPosition() 34 { 35 window.setTimeout( " _Default.ReadPosition(ReadPosition_callback) " , 600 ) 36 } 37 38 function ReadPosition_callback(response) 39 { 40 var value = response.value; 41 Image1.style.left = value.X; 42 Image1.style.top = value.Y; 43 Image1.style.display = '' ; 44 } 45 </ script > 46 </ body >2. 页面后台文件 AjaxDrag.aspx.cs 代码如下:
1 public partial class _Default : System.Web.UI.Page 2 { 3 protected void Page_Load( object sender, EventArgs e) 4 { 5 Utility.RegisterTypeForAjax( typeof (_Default)); 6 } 7 8 [AjaxPro.AjaxMethod] 9 public void WritePosition( int x, int y) 10 { 11 string strFileName = this .GetFileName(); 12 if (File.Exists(strFileName)) 13 { 14 StreamWriter sw = new StreamWriter(strFileName, false , System.Text.Encoding.UTF8); 15 sw.WriteLine(x.ToString() + " , " + y.ToString()); 16 sw.Flush(); 17 sw.Close(); 18 } 19 } 20 21 [AjaxPro.AjaxMethod] 22 public Point ReadPosition() 23 { 24 StreamReader sr = new StreamReader( this .GetFileName(), System.Text.Encoding.Default); 25 string str_X_Y = "" ; 26 while (sr.Peek() >= 0 ) 27 { 28 str_X_Y = sr.ReadLine(); 29 break ; 30 } 31 sr.Close(); 32 33 string [] str_x_y = str_X_Y.Split( ' , ' ); 34 Point p = new Point(); 35 p.X = int .Parse(str_x_y[ 0 ]); 36 p.Y = int .Parse(str_x_y[ 1 ]); 37 38 return p; 39 } 40 41 private string GetFileName() 42 { 43 string rootCatoryName = " AjaxDragControl " ; 44 string strPath = Server.MapPath( " . " ); 45 strPath = strPath.Substring( 0 , strPath.IndexOf(rootCatoryName) + rootCatoryName.Length); 46 string strFileName = Path.Combine(strPath, " save.txt " ); 47 return strFileName; 48 } 49 }(五). 示例代码下载
http://www.cnitblog.com/Files/ChengKing/AjaxDragControl.rar
(六). 相关文章请看
1. 在WinForm中实现拖动效果, 请看:
http://blog.csdn.net/chengking/archive/2005/10/07/496739.aspx
2. 使用键盘模拟鼠标, 请看:
http://blog.csdn.net/chengking/archive/2005/10/07/496715.aspx
