??xml version="1.0" encoding="utf-8" standalone="yes"?>中文字幕亚洲一区,中文字幕亚洲综合久久男男,亚洲性无码av在线http://www.tkk7.com/feingto/category/28515.html  ? ?/description>zh-cnWed, 09 Jan 2008 15:15:49 GMTWed, 09 Jan 2008 15:15:49 GMT60FckEditor中文配置手册详细说明http://www.tkk7.com/feingto/archive/2008/01/09/173964.htmlfeingtofeingtoWed, 09 Jan 2008 04:52:00 GMThttp://www.tkk7.com/feingto/archive/2008/01/09/173964.htmlhttp://www.tkk7.com/feingto/comments/173964.htmlhttp://www.tkk7.com/feingto/archive/2008/01/09/173964.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/173964.htmlhttp://www.tkk7.com/feingto/services/trackbacks/173964.html Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<script. type=”text/javascript” src=”FCKeditor/fckeditor.js”></scrīpt>
<textarea name=”content” cols=”80″ rows=”4″>
</textarea>
<script. type=”text/javascript”>
var FCKeditor = new FCKeditor(”content”);
oFCKeditor.BasePath = “FCKeditor/”;
oFCKeditor.Height = 400;
oFCKeditor.ToolbarSet = “Default”;
oFCKeditor.ReplaceTextarea();
</script>
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
如果惌使用从数据库L的文本数据或者是后台来自文g的txt/html文本数据?
只要?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<textarea name=”content” cols=”80″ rows=”4″>
</textarea>
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
中加入自q昄内容的formbean对应字段卛_
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<textarea name=”content” cols=”80″ rows=”4″>
<c:out value=”${contentData}” />
</textarea>
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
q样内容׃被显C在FCKeditor~辑框中了,点击提交按钮以后可以在后台的相应java action中得到content参数中的内容是面上FCKeditor中的内容数据了。可以在struts/jsf中用?
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
׃lFCKeditor瘦nQ所以常会报~少对象支持{错误,只要在FCKeditor/editor/lang中加上相应的js语言文g卛_。如果加载页面失败(FCKeditor未定义)q有一个可能就是引用FCKeditor/fckeditor.js文g路径不对Q?
关于FCKeditor瘦n要点如下Q?
1.FCKeditor目录下及子目录下所有以“_”下划U开头的文g夹删?
2.FCKeditor根目录下只保留fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xmlQ其余全部删?
3.editor/filemanager/upload目录下文件及文gҎI?
4.?editor/filemanager/browser/default/connectors/下的所有文件删?
5.q可以将editor/skins目录下的皮肤文g删除Q只留下default一套皮肤(如果你不需要换皮肤的话Q?
6.q可以将editor/lang目录下文件删除,只保留en.js, fcklanguagemanager.js, zh-cn.js, zh.js文g
7.如果你是使用javascrīpt来调用加载FCKeditorQ那么就不需要在web.xml中配|fckeditor的tag文g?
8.q有一个问题刚开始用FCKeditor的h怼遇到怎么控制它的toolbar的大和元素排列Q其实很单?
在fckconfig.js中用q样的标{[]来划分每行的元素的多,q样可以控制toolbar的长短和大小了,具体CZ参看Qfckconfig.js中的toolbarset[”Default”]
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
用fckconfig.js中的一些选项来控制toolbarset中控件的功能Q实现功能裁剪:
1)Q取消超链接中的览服务器和上传功能Q方法如下:
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCKConfig.LinkBrowser = true;
FCKConfig.LinkUpload = true;
改ؓQ?
FCKConfig.LinkBrowser = false;
FCKConfig.LinkUpload = false;
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
2)Q取消图片链接中的浏览服务器和上传功能,Ҏ如下Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCKConfig.ImageUpload = true;
FCKConfig.ImageBrowser = true;
改ؓQ?
FCKConfig.ImageUpload = false;
FCKConfig.ImageBrowser = false;
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
3)QDlg Button中取消高U功能,Ҏ如下Q?
FCKConfig.LinkDlgHideAdvanced = false ;
FCKConfig.ImageDlgHideAdvanced = false ;
改ؓQ?
FCKConfig.ImageDlgHideAdvanced = true ;
FCKConfig.LinkDlgHideTarget = true ;
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
下一介lFCKeditor的上传和览服务器功能,以及如何在里面实现动?
连接,转发到servletl过filter以后去调用服务器的action
如何实现对应用户览自己的图片的列表实现Q?
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
FCKeditor集成java servlet可以实现文g的上传和服务器端列表d功能FCKeditor自己提供了两个servlet来分别实C传文件功能,和读取服务器端文件列表功能,q两个servlet分别为:
com.fredck.FCKeditor.connector.ConnectorServletQ读取文件列表)
com.fredck.FCKeditor.uploader.SimpleUploaderServletQ实现文件上传)
1.览服务器端文g列表
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
web.xml文g中,比如QConnectorServlet中的配置选项Q?
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param>
意思是在浏览服务器上的baseDir配置指定里面的所有文件及其目录结构列表?
如果你的baseDir没有配置QConnector会自动创徏一个默认的文g?
UserFilesQ对应的ConnectorServlet中init()Ҏ中代码如下:
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
baseDir = getInitParameter(”baseDir”);
if (baseDir == null)
baseDir = “/UserFiles/”;
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
q想说一下的是,FCKeditor的client调用server的servletҎ采用的是Ajax思想来实现。当你点L览服务器(browser server)的时候就会触发一个异步的javascrīpt + xmlhttp的调用响应,后台的servlet会去完成你要h的事Ӟ然后数据以xml方式q回lclient来解析。很明显Q你要实现去数据库或者其他的文gpȝh列表Q你只要修改
ConnectorServlet中两个私有方法:getFolders ?getFiles
让它M指定的地方得到文件列表即可,q样你的文g可以攑֜M你指定目录下。多说一句,很多人都想知道个人blogpȝ中怎么实现上传文g以后对应用户览自己的列表的Q我的做法很单,建立你用户名的文件夹Q你上传只能上传C的目录夹Q浏览可以通过E序指定览对应用户下的文g夹即可,q个时候你要修改Connectorservlet中的路径卛_Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
2.连接重定位问题
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCKeditor可以插入连接,实现Ҏ件的预览功能Q只要我们稍微改变我们可以FCKeditor~辑器支持对L文gpȝ下的L文g的客L览和下载保存!FCKeditor本来提供的是相对URL链接,只要我们修改ConnectorServlet中传递给客户端的地址的时候,把它改写成绝对URL然后再通过我们自己的filter的servlet实现重定向去一个下?览文g的struts的actionҎ可以实现在客户端对连接文件的下蝲和浏览!说一下具体做法吧Q?
1)Q修改ConnectorServlet传递给客户端javascrīpt的\径,代码如下Q?
String currentUrl = “http://” + request.getserver +request.getServerPort + request.getContextPath + resourcePath;
以上代码请在ConnectorServlet的doGet()里面DQ在调用CreateCommonXml()U有Ҏ的时候参C入:
myEl.setAttribute(”path”,currentPath);
myEl.setAttribute(”url”,currentUrl);
提醒一下resourcePath为在web.xml配置文g中ConnectorServlet中的一个初始化参数配置Q等一下利用filter实现对超q接的重定位提取URL中的q个配置参数来判断,配置如下Q?
<init-param>
<param-name>resourcePath</param-name>
<param-value>/fileSystem/</param-value>
</init-param>
2)Q徏立你的filter servletQ实现对URL的截P对符合要求的URLq行重定位到你的对应action中去卛_
3)Q实C的对应action来实现文件的上传和下载功能即可!
4)Q扩展功能-实现对URL的加密,对连接的URL中加上一串字W,最后几位作为算法校验,对不W合要求的URLq接,filter会拒绝重定位到指定action。此外利用自己写的扩展类q可以实现对连接的文gcdq行限制Q比如你只能连接JPG|GIF|DOC|TXT|HTML{几U后~名的文gQ对其他文g即你指定超q接也让你浏览和下蝲Q这些都可以在web.xml中通过修改对应servlet的配|文件的初始化参数实现?
3.面javascrīpt修改
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
览服务器的功能对应的html/javascrīpt相关的文件ؓQbrowser.html和frmresourcelist.html对应你想传递的信息你可以append在文件名的字W串后面Q在GetFileRowHtmlQ)的javascrīpt函数中实现对文g名的截取Q这样client只会昄文g名,而你可以得到文g的数据库唯一标识QQ何你惌的信息你都可以通过修改ConnectorServlet中的U有ҎgetFiles()来实玎ͼ只要修改面frmresurcelist.html中的GetFileRowHtmlQ)中传入变量fileName卛_。你q可以在点击选中文g的时候实C个你自己的Ajax调用Q一切取决你的项目需要!
4.我不是一个javascrīpt高手Q其实如果我对javascrīpt了解多一些也许对客户端的代码修改以后做出更眩的功能。可以更好的完成对FCKeditor裁剪?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
5.注意?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
无论怎么修改别h的东西,请一定尊重开源精!
很多人配|好了FCKeditor的上传功能以后常会遇到xmlhttp request 404 error,后面是一串\径,其实是你的servlet-mapping中的路径不对Q你只要把xmlhttp request errot 404 后面跟的路径QcopyC的web.xml中对应红色文字的位置Q如下:
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
</servlet-mapping>
别忘了SimpleUploader的servletQmapping也要做同L修改Q?
q有一个错误就是http 500错误Q这个可能是你的URLh不对Q应该和FCKeditor没关pȝ!
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
fckconfig.js总配|文Ӟ可用记录本打开Q修改后文件存为utf-8 ~码格式。找刎ͼ
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCKConfig.TabSpaces = 0;
改ؓQ?
FCKConfig.TabSpaces = 1;
卛_~辑器域内可以用Tab键?
如果你的~辑器还用在|站前台的话Q比如说用于留言本或是日记回复时Q那׃得不考虑安全了,
在前台千万不要用Default的toolbarQ要么自定义一下功能,要么qpȝ已经定义好的BasicQ?
也就是基本的toolbarQ找刎ͼ
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCKConfig.ToolbarSets[”Basic”] = [
[’Bold’,'Italic’,'-’,'OrderedList’,'UnorderedList’,'-’,/*’Link’,*/’Unlink’,'-’,'Style’,'FontSize’,'TextColor’,'BGColor’,'-’,
‘Smiley’,'SpecialChar’,'Replace’,'Preview’] ];
q是改过的BasicQ把囑փ功能LQ把d链接功能LQ因为图像和链接和flash和图像按钮添加功能都能让前台늛接访问和上传文gQ?fckeditorq支持编辑域内的鼠标右键功能?
FCKConfig.ContextMenu = [’Generic’,/*’Link’,*/’Anchor’,/*’Image’,*/’Flash’,'Select’,'Textarea’,'Checkbox’,'Radio’,'TextField’,'HiddenField’,
/*’ImageButton’,*/’Button’,'BulletedList’,'NumberedList’,'TableCell’,'Table’,'Form’];
q也是改q的把鼠标右键的“链接、图像,FLASHQ图像按?#8221;功能都去掉?
扑ֈQ?
FCKConfig.FontNames = ‘Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana’;
加上几种我们常用的字?
FCKConfig.FontNames = ‘宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana’;
d文g /TestFCKeditor/test.jsp:
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<%@ page language=”java” import=”com.fredck.FCKeditor.*” %>
<%@ taglib uri=”/TestFCKeditor” prefix=”FCK” %>
<script. type=”text/javascript” src=”/TestFCKeditor/FCKeditor/fckeditor.js”></script>
<%–
三种Ҏ调用FCKeditor
1.FCKeditor自定义标{?(必须加头文g <%@ taglib uri=”/TestFCKeditor” prefix=”FCK” %> )
2.script脚本语言调用 (必须引用 脚本文g <script. type=”text/javascript” src=”/TestFCKeditor/FCKeditor/fckeditor.js”></script> )
3.FCKeditor API 调用 (必须加头文g <%@ page language=”java” import=”com.fredck.FCKeditor.*” %> )
–%>
<%–
<form. action=”show.jsp” method=”post” target=”_blank”>
<FCK:editor id=”content” basePath=”/TestFCKeditor/FCKeditor/”
width=”700″ height=”500″ skinPath=”/TestFCKeditor/FCKeditor/editor/skins/silver/”
toolbarSet = “Default”>
内容
</FCK:editor>
<input type=”submit” value=”Submit”>
</form>
–%>
<form. action=”show.jsp” method=”post” target=”_blank”>
<table border=”0″ width=”700″>
<tr>
<td>
<textarea id=”content” name=”content” style=”WIDTH: 100%; HEIGHT: 400px”>input</textarea>
<script. type=”text/javascript”>
var FCKeditor = new FCKeditor(’content? ;
oFCKeditor.BasePath = “/TestFCKeditor/FCKeditor/” ;
oFCKeditor.Height = 400;
oFCKeditor.ToolbarSet = “Default” ;
oFCKeditor.ReplaceTextarea();
</script>
<input type=”submit” value=”Submit”>
</td>
</tr>
</table>
</form>
<%–
<form. action=”show.jsp” method=”post” target=”_blank”>
<%
FCKeditor oFCKeditor ;
oFCKeditor = new FCKeditor( request, “content” ) ;
oFCKeditor.setBasePath( “/TestFCKeditor/FCKeditor/” ) ;
oFCKeditor.setValue( “input” );
out.println( oFCKeditor.create() ) ;
%>
<br>
<input type=”submit” value=”Submit”>
</form>
–%>
d文g/TestFCKeditor/show.jsp:
<%
String content = request.getParameter(”content”);
out.print(content);
%>
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
1、适时打开~辑?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
很多时候,我们在打开面的时候不需要直接打开~辑器,而在用到的时候才打开Q这样一来有很好的用户体验,另一斚w可以消除FCK在加载时寚w面打开速度的媄响,点击“Open Editor”按钮后才打开~辑器界面?
实现原理Q?
使用JAVASCRIPT版的FCKQ在面加蝲Ӟ未打开FCKQ,创徏一个隐藏的TextArea域,q个TextArea
的name和ID要和创徏的FCK实例名称一_然后点击”Open Editor”按钮Ӟ通过调用一D函敎ͼ使用
FCK的ReplaceTextarea()Ҏ来创建FCKeditorQ代码如下:
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<script. type=”text/javascript”>
<!–
function showFCK(){
var FCKeditor = new FCKeditor( ‘fbContent’ ) ;
oFCKeditor.BasePath = ‘/FCKeditor/’ ;
oFCKeditor.ToolbarSet = ‘Basic’ ;
oFCKeditor.Width = ‘100%’ ;
oFCKeditor.Height = ‘200′ ;
oFCKeditor.ReplaceTextarea() ;
}
//–>
</script>
<textarea name=”fbContent” id=”fbContent”></textarea>
2、用FCKeditor ?API
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
FCKeditor~辑器,提供了非怸富的APIQ用于给End User实现很多惌定制的功能,比如最基本的数据验证,如何在提交的时候用JS判断当前~辑器区域内是否有内容,FCK的API提供了GetLength()ҎQ?
再比如如何通过脚本向FCK里插入内容,使用InsertHTML(){;
q有Q在用户定制功能Ӟ中间步骤可能要执行FCK的一些内嵌操作,那就用ExecuteCommand()Ҏ?
详细的API列表Q请查看FCKeditor的Wiki。而常用的APIQ请查看FCK压羃包里的_samples/html/sample08.html。此处就不脓代码了?
3、外联编辑条Q多个编辑域q一个编辑条Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
q个功能?.3版本才开始提供的Q以前版本的FCKeditor要在同一个页面里用多个编辑器的话Q得一个个创徏Q现在有了这个外联功能,׃用那么麻烦了Q只需要把工具条放在一个适当的位|,后面可以无限制的创建编辑域了?
要实现这U功能呢Q需要先在页面中定义一个工h的容器:<div id=”xToolbar”></div>Q然后再Ҏq个容器的id属性进行设|?
JAVASCRIPT实现代码Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
<div id=”xToolbar”></div>
FCKeditor 1:
<script. type=”text/javascript”>
<!–
// Automatically calculates the editor base path based on the _samples directory.
// This is usefull only for these samples. A real application should use something like this:
// oFCKeditor.BasePath = ‘/fckeditor/’; // ‘/fckeditor/’ is the default value.
var sBasePath = document.location.pathname.substring(0,document.location.pathname.lastIndexOf(’_samples’));
var FCKeditor = new FCKeditor( ‘FCKeditor_1′ );
oFCKeditor.BasePath = sBasePath;
oFCKeditor.Height = 100;
oFCKeditor.Config[ ‘ToolbarLocation’ ] = ‘Out:parent(xToolbar)’;
oFCKeditor.Value = ‘This is some <strong>sample text</strong>. You are using FCKeditor.’;
oFCKeditor.Create();
//–>
</script>
<br />
FCKeditor 2:
<script. type=”text/javascript”>
<!–
FCKeditor = new FCKeditor( ‘FCKeditor_2′ );
oFCKeditor.BasePath = sBasePath;
oFCKeditor.Height = 100;
oFCKeditor.Config[ ‘ToolbarLocation’ ] = ‘Out:parent(xToolbar)’;
oFCKeditor.Value = ‘This is some <strong>sample text</strong>. You are using FCKeditor.’;
oFCKeditor.Create();
//–>
</script>
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
此部分的详细DEMO请参照_samples/html/sample11.htmlQ_samples/html/sample11_frame.html
4、文件管理功能、文件上传的权限问题
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
一直以来FCKeditor的文件管理部分的安全是个值得注意Q但很多人没注意到的地方Q虽然FCKeditor在各个Release版本中一直存在的一个功能就是对上传文gcdq行qoQ但是她没考虑q另一个问题:到底允许谁能上传Q到底谁能浏览服务器文gQ?
之前刚开始用FCKeditorӞ我就出现q这个问题,q好NetRubeQFCKeditor中文化以及FCKeditor ASP版上传程序的作者)及时提醒了我Q做法是M改FCK上传E序Q在里面q行权限判断Qƈ且再在fckconfig.js里把相应的一些功能去掉。但随之FCK版本的不断升U,每升一ơ都要去改一ơ配|程序fckconfig.jsQ我发觉厌烦了,没什么办法能更好的控制这U配|么Q事实上Q是有的?
在fckconfig.js里面Q有关于是否打开上传和浏览服务器的设|,在创建FCKeditorӞ通过E序来判断是否创建有上传览功能的编辑器。首先,我先在fckconfig.js里面把所有的上传和浏览设|全设ؓfalseQ接着我用的代码如下Q?
JAVASCRIPT版本Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
<script. type=”text/javascript”>
var FCKeditor = new FCKeditor( ‘fbContent’ );
<% if power = powercode then %>
oFCKeditor.Config[’LinkBrowser’] = true;
oFCKeditor.Config[’ImageBrowser’] = true;
oFCKeditor.Config[’FlashBrowser’] = true;
oFCKeditor.Config[’LinkUpload’] = true;
oFCKeditor.Config[’ImageUpload’] = true;
oFCKeditor.Config[’FlashUpload’] = true;
<% end if %>
oFCKeditor.ToolbarSet = ‘Basic’;
oFCKeditor.Width = ‘100%’;
oFCKeditor.Height = ‘200′;
oFCKeditor.Value = ‘’;
oFCKeditor.Create();
</script>
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
在按钮旁边加文字
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
打开 editor/js/ 两个js文g
fckeditorcode_gecko.js
fckeditorcode_ie.js
W一个是支持非ie览器的
W二个文件是支持ie览器的
搜烦 FCKToolbarButtonQ可以看到许多类DL语句Q?
case ‘Save’:B = new FCKToolbarButton(’Save’, FCKLang.Save, null, null, true, null, 3); break;
‘Save’是按钮英文名?
FCKToolbarButton 的四个参数分别是Q?
按钮命o名称Q按钮标{文字,按钮工具提示Q按钮样式,按钮是否在源代码模式可见Q按钮下拉菜单其中将W?参数设|ؓ FCK_TOOLBARITEM_ICONTEXT 卛_使按钮旁边出现文字,注意没有引号?
例如Q?
case ‘Preview’:B = new FCKToolbarButton(’Preview’, FCKLang.Preview, null, FCK_TOOLBARITEM_ICONTEXT, true, null, 5);
q样我们可以将 我们l常用的3U模式源代码、预览、全屏编辑按钮都加上文字了?
解释fck样式的工作原?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q?
fck的样式设|涉及到了两个文Ӟ一个是你定义好的样式表文g.cssQ另一个是告诉fck样式表如何用的xml文gQ两个文件确一不可?
css文g的位|是不做要求的,但是需要你在应用的~辑器的面上插入样式表文g的链接。这h能显C出来样式?
fckstyles.xml 在与editor目录同的目录下。该文g定义了那些样式可以用在那些标签里面?
q就是fck自带的样式xml定义Q?
<?xml version=”1.0″ encoding=”utf-8″ ?>
<Styles>
<Style name=”Image on Left” element=”img”>
<Attribute name=”style” value=”padding: 5px; margin-right: 5px” />
<Attribute name=”border” value=”2″ />
<Attribute name=”align” value=”left” />
</Style>
<Style name=”Image on Right” element=”img”>
<Attribute name=”style” value=”padding: 5px; margin-left: 5px” />
<Attribute name=”border” value=”2″ />
<Attribute name=”align” value=”right” />
</Style>
<Style name=”Custom Bold” element=”span”>
<Attribute name=”style” value=”font-weight: bold;” />
</Style>
<Style name=”Custom Italic” element=”em” />
<Style name=”Title” element=”span”>
<Attribute name=”class” value=”Title” />
</Style>
<Style name=”Code” element=”span”>
<Attribute name=”class” value=”Code” />
</Style>
<Style name=”Title H3″ element=”h3″ />
<Style name=”Custom Ruler” element=”hr”>
<Attribute name=”size” value=”1″ />
<Attribute name=”color” value=”#ff0000″ />
</Style>
</Styles>
每一?lt;style>来会生成一个样式的菜单Vname名称是昄在菜单里的文字;element定义了该样式可以应用在那Uhtml标签上,<Attribute>?name 指定了将会修Ҏ{哪个属性来应用样式Qvalue则是修改成的倹{?
看这个:
<Style name=”Title” element=”span”>
<Attribute name=”class” value=”Title” />
</Style>
如果你在fck选定了文?“l典论坛 ?前台制作与脚本专??FCKeditor 实战技?- 1 ?~辑帖子” 应用该样?则原来文字就会变?lt;span class=”Title”>l典论坛 ?前台制作与脚本专??FCKeditor 实战技?- 1 ?~辑帖子</span>
注意Q如果编辑器呈整늼辑状态,那么整页里面也需要插入样式表链接才能昄出来样式?
Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=Q=
FCKeditor JavaScript. APIQ翻译整理)
原文地址Q?a target="_new">http://wiki.fckeditor.net/Developer%27s_Guide/Javascript_API
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
FCK ~辑器加载后Q将会注册一个全局?FCKeditorAPI 对象?
FCKeditorAPI 对象在页面加载期间是无效的,直到面加蝲完成。如果需要交互式地知?FCK ~辑器已l加载完成,可?#8220;FCKeditor_OnComplete”函数?
<script. type=”text/javascript”>
function FCKeditor_OnComplete(editorInstance) {
FCKeditorAPI.GetInstance(’FCKeditor1′).Commands.GetCommand(’FitWindow’).Execute();
}
</script>
在当前页获得 FCK ~辑器实例:
var Editor = FCKeditorAPI.GetInstance(’InstanceName’);
?FCK ~辑器的弹出H口中获?FCK ~辑器实例:
var Editor = window.parent.InnerDialogLoaded().FCK;
从框枉面的子框架中获得其它子框架的 FCK ~辑器实例:
var Editor = window.FrameName.FCKeditorAPI.GetInstance(’InstanceName’);
从页面弹出窗口中获得父窗口的 FCK ~辑器实例:
var Editor = opener.FCKeditorAPI.GetInstance(’InstanceName’);
获得 FCK ~辑器的内容Q?
oEditor.GetXHTML(formatted); // formatted 为:true|falseQ表C是否按HTML格式取出
也可用:
oEditor.GetXHTML();
讄 FCK ~辑器的内容Q?
oEditor.SetHTML(”content”, false); // W二个参CؓQtrue|falseQ是否以所见即所得方式设|其内容。此Ҏ常用?#8220;讄初始?#8221;?#8220;表单重置”操作?
插入内容?FCK ~辑器:
oEditor.InsertHtml(”html”); // “html”为HTML文本
?FCK ~辑器内Ҏ否发生变化:
oEditor.IsDirty();
?FCK ~辑器之外调?FCK ~辑器工h命oQ?
命o列表如下Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
DocProps, Templates, Link, Unlink, Anchor, BulletedList, NumberedList, About, Find, Replace, Image, Flash, SpecialChar, Smiley, Table, TableProp, TableCellProp, UniversalKey, Style, FontName, FontSize, FontFormat, Source, Preview, Save, NewPage, PageBreak, TextColor, BGColor, PasteText, PasteWord, TableInsertRow, TableDeleteRows, TableInsertColumn, TableDeleteColumns, TableInsertCell, TableDeleteCells, TableMergeCells, TableSplitCell, TableDelete, Form, Checkbox, Radio, TextField, Textarea, HiddenField, Button, Select, ImageButton, SpellCheck, FitWindow, Undo, Redo
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
使用Ҏ如下Q?
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-
oEditor.Commands.GetCommand(’FitWindow’).Execute();
Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-Q-

feingto 2008-01-09 12:52 发表评论
]]>
FCKEditor的赋值和取值操?http://www.tkk7.com/feingto/archive/2008/01/09/173963.htmlfeingtofeingtoWed, 09 Jan 2008 04:51:00 GMThttp://www.tkk7.com/feingto/archive/2008/01/09/173963.htmlhttp://www.tkk7.com/feingto/comments/173963.htmlhttp://www.tkk7.com/feingto/archive/2008/01/09/173963.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/173963.htmlhttp://www.tkk7.com/feingto/services/trackbacks/173963.html1、获取编辑器中HTML内容

function getEditorHTMLContents(EditorName)

    
var oEditor = FCKeditorAPI.GetInstance(EditorName); 
    
return(oEditor.GetXHTML(true)); 
}


2、获取编辑器中文字内容(在博客发布时获取无html代码摘要使用Q?/p>

function getEditorTextContents(EditorName)

    
var oEditor = FCKeditorAPI.GetInstance(EditorName); 
    
return(oEditor.EditorDocument.body.innerText); 
}


3、设|编辑器中内?/p>

function SetEditorContents(EditorName, ContentStr)

    
var oEditor = FCKeditorAPI.GetInstance(EditorName) ; 
    oEditor.SetHTML(ContentStr) ; 
}



feingto 2008-01-09 12:51 发表评论
]]>
Script.aculo.us开发系??:使用DropDrag定义拖拽行ؓhttp://www.tkk7.com/feingto/archive/2008/01/05/172962.htmlfeingtofeingtoSat, 05 Jan 2008 06:14:00 GMThttp://www.tkk7.com/feingto/archive/2008/01/05/172962.htmlhttp://www.tkk7.com/feingto/comments/172962.htmlhttp://www.tkk7.com/feingto/archive/2008/01/05/172962.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/172962.htmlhttp://www.tkk7.com/feingto/services/trackbacks/172962.html

在不同的览器上默认的拖拽能解决的问题相当少,所以有很多的框枉能实现这么个功能.使用拖拽行ؓ能很好的改善用户体验,其是在购物的时候能让用h到很新奇和体?Script.aculo.us使用了三个类实现拖拽和排?它们是Draggable,Droppable,Sortable.要实C个完整的拖拽行ؓ,需要Draggable,和Droppable的配合?׃q连个类的方法比较多,我只选取比较实用的几个方法进行介l?q是老规?先看看Demo:http://www1.qcxy.hb.cn/qphy/Script_Aculo_Us/DragDrop.html

Draggable

new Draggable("DraggableId"[,options])

主要选项

  • snap:推拽的最单?默认为false,可以是数l或者函?这个属性设|ؓ[50,50],意味着最的位移单位?0px,50px,如果讄Z个函?q个函数的参Cؓ(x,y),q个x,y指示当前的绝对坐?函数应该q回二维数组,上面的例子中的Drag(UnAcceptable)推拽到页面的左上角是׃"吔R"上去,是因ؓ函数的作?详细见源?
  • revert:推拽完毕之后是否回到原来的位|?默认为false,也可以是一个函?q个函数必须q回true/false
  • handle:"提手",Ud整个块的时候通常不需要在整个块的区域都可以拖?比如Ud一个栏?通常只需要拖拽标?比如Google的个性化主页),该属性设|ؓ标题的Id
  • ghosting:推拽的过E中是否昄"影子",默认为false
  • constraint:限制能拖动的方向,默认的两个方向都可以,可以讄?vertical","horizontal"的Q?
  • zindex:"影子"的z-Index属?
  • scroll:拖拽图范围是否显C动滚?
  • scrollSensitivity/scrollSpeed:默认值分Zؓ20/15,控制滚动的敏感度和滚动速度
  • delay:拖拽前的延时,开始拖拽后l过q个旉?回过来"

q里需要说明的是ƈ非所有的标签都支持该行ؓ,详细的情况请参阅官方文档

API

  • onStart:开始拖拽调用该函数,接受两个参数(obj,oEvent)前者是$(DraggableId),后者是当前事g的event对象
  • onDrag:在拖拽过E中反复的调用该函数,同样接受两个参数(obj,oEvent)
  • change:在onDrag后调?也会反复调用
  • onEnd:拖拽行ؓl束调用,即鼠标弹hȀ?
  • destroy():该方法销毁元素的拖拽行ؓ

Droppables

Droppables(注意是复数Ş?是一个抽象类,不能被实例化,只有一些静态方?常用的方法有add和move,分别增加可放|元?和去除可攄元素

addҎ:Dropables.add("ContainerId"[,options]),常用的选项

  • accept: 数组或者字W串,表示该容器接受的元素的className的集?默认的Q何元素都接收
  • hoverclass:当符合接受要求的元素拖至容器上时,其className
  • onDrop():被拖拽的W合要求的元素在q里攄时调用该函数,接受三个参数(draggable,droppable,oEvent),draggable是被拖拽元素,droppable是被攄元素,oEvent当前事g对象

remove("ContainerId"),该方法去除容器的攄行ؓ

(上面例子的源代码)

Sortable

Sortable是一l可以通过拖拽交换位置的元?可以先看看实?

serialize(sortable)Ҏ:该方法返回当前容器内元素的次?但是要求子元素的id必须?item_"开?且返回格式有讲究,看下面的例子

<div id="horizontalSortable" class="item" style="margin-top:20px; height:40px;">
      <div id="item_5">IE</div>
      <div id="item_6">FireFox</div>
      <div id="item_7">Safari</div>
      <div id="item_8">Opera</div>
</div>

Sortable.create("horizontalSortable",
{
     ghosting:true,
     tag:'div',
     constraint:'horizontal',
     hoverclass:'hoverClass2'
});

Sortable.serialize('horizontalSortable')
//-->horizontalSortable[]=5&horizontalSortable[]=6&horizontalSortable[]=7&horizontalSortable[]=8

最后看一个例?前面提到的containment选项在某些情况下很有?比如要实C个容器里的元素可以互怺换子元素,即从一个容器拖至o一个容器中.来看下面的例?/p>

<script type="text/javascript">
  Sortable.create('sortUlLeft',{containment:['sortUlLeft','sortUlRight'], dropOnEmpty:
true,ghosting:true,constraint:false,hoverclass:'hoverClass'});
  Sortable.create('sortUlRight',{containment:['sortUlLeft','sortUlRight'], dropOnEmpty:
true,ghosting:true,constraint:false,hoverclass:'hoverClass'});

</script>

上面的例子可以实现sortUlLeft,和sortUlRight的子元素互相交换



feingto 2008-01-05 14:14 发表评论
]]>
用script.aculo.us实现像google suggest自动完成功能http://www.tkk7.com/feingto/archive/2008/01/03/172358.htmlfeingtofeingtoThu, 03 Jan 2008 01:20:00 GMThttp://www.tkk7.com/feingto/archive/2008/01/03/172358.htmlhttp://www.tkk7.com/feingto/comments/172358.htmlhttp://www.tkk7.com/feingto/archive/2008/01/03/172358.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/172358.htmlhttp://www.tkk7.com/feingto/services/trackbacks/172358.html实现像google suggest自动完成功能

首先创徏一个jsp

<%@ page language="java" pageEncoding="UTF-8"%>

<html>
<head>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/effects.js"></script>
<script type="text/javascript" src="js/controls.js"></script>
<style>
div.auto_complete {
  width: 350px;
  background: #fff;
}
div.auto_complete ul {
  border:1px solid #888;
  margin:0;
  padding:0;
  width:100%;
  list-style-type:none;
}
div.auto_complete ul li {
  margin:0;
  padding:3px;
}
div.auto_complete ul li.selected {
  background-color: #ffb;
}
div.auto_complete ul strong.highlight {
  color: #800;
  margin:0;
  padding:0;
}
</style>

</head>
<body>
<input type="text" id="autocomplete"/>
<div id="results" class="auto_complete"></div>
<script type="text/javascript">
 new Ajax.Autocompleter(
  "autocomplete",
  "results",
  "list.html", {
   method: "GET"
  }
 );
</script>
</body>
</html>

 

list.html

<ul>
<li>Aria</li>
<li>Aaaa</li>
<li>Afdsa</li>
<li>bsa</li>
</ul>

上面list.html采用静态页面返回列表,读者可以用动态页面返回结果?



feingto 2008-01-03 09:20 发表评论
]]>
AJAX框架/库比较和选择QECHO2, GWT, DOJO, PROTOTYPE, JQUERYhttp://www.tkk7.com/feingto/archive/2007/12/30/171750.htmlfeingtofeingtoSun, 30 Dec 2007 12:37:00 GMThttp://www.tkk7.com/feingto/archive/2007/12/30/171750.htmlhttp://www.tkk7.com/feingto/comments/171750.htmlhttp://www.tkk7.com/feingto/archive/2007/12/30/171750.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/171750.htmlhttp://www.tkk7.com/feingto/services/trackbacks/171750.html 首先Q要在两个类别中选择Q一个是~译c,一个是非编译类别?br /> Echo2/GWT是将JAVA代码~译成JAVASCRIPTQ乍看很方便Q不用掌握JS也能做出炫目界面。但q只适于不会或者不想了解JS的情况,对于q是惛_全控制和定制界面的项目就不适合?br /> 另外Q有一U观点认为JAVA->JS转换是一U低U语a向高U语a转换Q本w没有意义。有点像d汇编Q然后再找个工具把汇~语a代码转换成C代码来用。我虽然没完全想通这个观点,不过Q我一直用C/C++Q这几年才逐渐发现JAVA实是一U进化。没准别的是对的呢?
在Echo2和GWT中,GWT大部分工作是在客LQ尽量少跟SERVER打交道,适合大型|站q用QECHO2信奉“用到才加?#8221;的信条,所以会有大量向SERVER的访问,适合企业应用。另外,个h觉得ECHO2是个更全面的的一站式框架Q界面也非常炫。但它的开发工兯收费?br /> 再谈非编译类别,它们包括DOJO、PROTOTYPE、JQEURYQ下面一一介绍Q?br /> 先说PROTOTYPEQ它比较轻量极,能让你的代码更加化。最l典莫过?#8220;圆函数”Q?br /> document.getElementById(’elementid’) 变成$(’elementid’)
它加ZJS语言的可开发性,降低了学习JS的门槛?br /> DOJO最吸引人的是它的事件系l和丰富的可定制lg。它可以用Ş如下面的语句为各UHTML元素加入事gQ?br /> dojo.event.connect(someNode, "onclick", doStuff);
正由于DOJO提供了强大功能,它分成了许多包,可以分别包含使用?br /> JQUERY也提供了圆函数Q它的插件系l也提供象DOJO的组Ӟ但它没有PROTOTYPE那样z,也没有DOJOq么多的lg供用,但它兼收两家优点Qƈ且个头不大,文档也算完整Q所以说它介乎于前述两者之间?
所以,如果你需要非常完整的工具lgLDOJOQ如果你想优化你的JS代码Q提高书写技巧请用PROTOTYPEQ如果你想两者兼ְ用JQUERY?

feingto 2007-12-30 20:37 发表评论
]]>
prototype.js开发笔?/title><link>http://www.tkk7.com/feingto/archive/2007/12/30/171739.html</link><dc:creator>feingto</dc:creator><author>feingto</author><pubDate>Sun, 30 Dec 2007 10:07:00 GMT</pubDate><guid>http://www.tkk7.com/feingto/archive/2007/12/30/171739.html</guid><wfw:comment>http://www.tkk7.com/feingto/comments/171739.html</wfw:comment><comments>http://www.tkk7.com/feingto/archive/2007/12/30/171739.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/feingto/comments/commentRss/171739.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/feingto/services/trackbacks/171739.html</trackback:ping><description><![CDATA[     摘要: Table of Contents 1. Programming Guide 1.1. Prototype是什? 1.2. 兌文章 1.3. 通用性方? 1.3.1. 使用 $()Ҏ 1.3.2. 使用$F()Ҏ 1.3.3. 使用$A()Ҏ 1.3.4. 使用$H()Ҏ 1.3.5. 使用$R()Ҏ 1.3.6. 使用Try.these()?..  <a href='http://www.tkk7.com/feingto/archive/2007/12/30/171739.html'>阅读全文</a><img src ="http://www.tkk7.com/feingto/aggbug/171739.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/feingto/" target="_blank">feingto</a> 2007-12-30 18:07 <a href="http://www.tkk7.com/feingto/archive/2007/12/30/171739.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>Prototype 1.5 Ajax 使用教程 http://www.tkk7.com/feingto/archive/2007/12/30/171737.htmlfeingtofeingtoSun, 30 Dec 2007 10:03:00 GMThttp://www.tkk7.com/feingto/archive/2007/12/30/171737.htmlhttp://www.tkk7.com/feingto/comments/171737.htmlhttp://www.tkk7.com/feingto/archive/2007/12/30/171737.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/171737.htmlhttp://www.tkk7.com/feingto/services/trackbacks/171737.html2.3  Prototype对Ajax的支?/h3>

作ؓ一个Ajax开发框ӞPrototype对Ajax开发提供了有力的支持。在Prototype中,与Ajax相关的类和对象包括:Ajax、Ajax.Responsders、Ajax.Base、Ajax.Request、Ajax. PeriodicalUpdater和Ajax.UpdaterQ图2-3所CZؓq些cd对象之间的关pd其常用属性和ҎQ下面分别对q些cd对象q行介绍?/p>

?-3  Prototype中Ajax相关cd对象关系C意?/p>

2.3.1  Ajax对象

Ajax对象为其他的Ajax功能cL供了最基本的支持,它的实现?.2.7节中?-10所C,其中包括一个方法getTransport和一个属性activeRequestCount。getTransportҎq回一个XMLHttpRequest对象QactiveRequestCount属性代表正在处理中的Ajaxh的个数?/p>

2.3.2  Ajax.Basec?/h3>

Ajax.BasecLAjax.RequestcdAjax.PeriodicalUpdatercȝ基类。它提供?个方法:

l  setOptionsQ设|Ajax操作所使用的选项?/p>

l  responseIsSuccessQ判断Ajax操作是否成功?/p>

l  responseIsFailureQ判断Ajax操作是否p|Q与responseIsSuccess相反Q?/p>

Ajax.Basecȝ主要作用是提取出一些公用的ҎQ其他类通过l承的方式用这些方法,实现代码复用?/p>

2.3.3  Ajax.Requestc?/h3>

q是Prototype中最l常使用的一个Ajax相关cRAjax.RequestcȝҎ通常是内部用的Q因此这里就不一一列DQ有兴趣的读者可以参考Prototype的源代码。这里重点讲讲如何用Ajax.Requestc,首先l出一个最单的Ajax.Requestcȝ应用CZQ如?-11所C,注意CZ中的黑体字?/p>

?-11  Ajax.Requestcd用示?/p>

Ajax.Request试面Q?/strong>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

    <head>

        <title>chapter 3</title>

        <script type="text/javascript" language="javascript"

         src="prototype.js" ></script>

        <script type="text/javascript" language="javascript">

        function test() {

            // 创徏Ajax.Request对象Q发起一个Ajaxh

            var myAjax = new Ajax.Request(

                'data.html', // h的URL

                {

                    method: 'get',  // 使用GET方式发送HTTPh

                    onComplete: showResponse // 指定h成功完成旉要执行的Ҏ

                }

            );

        }

        function showResponse(response) {

            $('divResult').innerHTML = response.responseText;

        }

        </script>

    </head>

    <body>

    <input type="button" value="click" onclick="test()" />

    <div id="divResult" />

    </body>

</html>

data.htmlQ?/strong>

<input type="text" id="name" />

<input type="button" value="Click Me" onclick="sayHi()">

Ajax.Request对象在初始化旉要提供两个参敎ͼW?个参数是要h面的URLQ这里用的data.html是一个普通的HTML静态页面;W?个参数是Ajax操作的选项Q在Prototype中ƈ没有专门为Ajax操作选项定义一个类Q通常都是像例2-11q样Q通过匿名对象的方式设|Ajax操作的参数。在?-11中,Ajax操作选项h两个属性:method表示HTTPh方式Q默认是POST方式QonComplete指定了Ajax操作完成以后Q即XMLHttpRequest对象的status属性ؓ4ӞQ页面将要执行的函数。当ӞAjax操作q包括很多其他选项Q如?-1所C?/p>

?-1  Ajax操作选项属性含?/p>

属性名U?/p>

含义

method

HTTPh方式QPOST/GET/HEADQ?/p>

parameters

在HTTPh中传入的URL格式的值列表,即URL串中问号之后的部分?/p>

asynchronous

是否做异步XMLHttpRequesth?/p>

postBody

在POSTh方式下,传入h体中的内宏V?/p>

requestHeaders

和请求一赯传入的HTTP头部列表Q这个列表必d有偶C目Q因为列表中每两ؓ一l,分别代表自定义部分的名称和与之对应的字符串倹{?/p>

onXXXXXXXX

在HTTPh、响应的q程中,当XMLHttpRequest对象状态发生变化时调用的响应函数。响应函数有5个:onUninitialized、onLoading、onLoaded、onInteractive和onComplete。传入这些函数的参数可以?个,其中W?个参数是执行HTTPh的XMLHttpRequest对象Q第2个参数是包含被执行的X-JSON响应的HTTP头?/p>

onSuccess

Ajax操作成功完成时调用的响应函数Q传入的参数与onXXXXXXXX相同?/p>

onFailure

Ajax操作h完成但出现错误时调用的响应函敎ͼ传入的参ConXXXXXXXX相同?/p>

onException

Ajax操作发生异常情况时调用的响应函数Q它可以接收2个参敎ͼ其中W?个参数是执行HTTPh的XMLHttpRequest对象Q第2个参数是异常对象?/p>

2.3.4  Ajax.Updaterc?/h3>

?-11使用Ajax.RequestcdC面的局部刷新效果,而这L似的功能在Ajax应用中是l常使用的。因此,Z化这U工作,Prototype框架从Ajax.RequetcMzZ个子cZ—Ajax.Updater。与Ajax.Request相比QAjax.Updater的初始化多了一个container参数Q该参数代表要更新的页面元素的id。例2-11的功能通过Ajax.Updater的实玎ͼ会变得更加简单,如例2-12所C?/p>

?-12  Ajax.Updatercȝ应用CZ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

    <head>

        <title>chapter 3</title>

        <script type="text/javascript" language="javascript"

         src="prototype.js" ></script>

        <script type="text/javascript" language="javascript">

        function test() {

            var myAjax = new Ajax.Updater(

                'divResult', // 更新的页面元?/strong>

                'data.html', // h的URL

                {

                    method: 'get'

                }

            );

        }

        </script>

    </head>

    <body>

    <input type="button" value="click" onclick="test()" />

    <div id="divResult" />

    </body>

</html>

此外QAjax.Updaterc还有另外一个功能,如果h的页面内容中包括JavaScript脚本QAjax.Updatercd以执行其中的脚本Q只需要在Ajax操作选项中增加属?#8220;evalScripts: true”卛_。对?-11中的data.htmlq行修改Q在其中加入JavaScript脚本Q如?-13所C?/p>

?-13  data.html

<script language="javascript" type="text/javascript">

sayHi = function() {

    alert("Hello, " + $F('name') + "!");

}

</script>

<input type="text" id="name" />

<input type="button" value="Click Me" onclick="sayHi()">

调用Ajax.Updater的JavaScript脚本修改为:

function test() {

    var myAjax = new Ajax.Updater(

        'divResult', // 更新的页面元?/p>

        'data.html', // h的URL

        {

            method: 'get',

            evalScripts: true

        }

    );

}

q样可以用data.html面的内Ҏ新当前页面中?lt;div>元素divResultQƈ且执行data.html面中包含的JavaScript脚本?/p>

q里需要注意的是例2-13中sayHi函数的写法,如果写成

function sayHi() {

    alert("Hello, " + $F('name') + "!");

}

或?/p>

var sayHi = function() {

    alert("Hello, " + $F('name') + "!");

}

E序是不能正常运行的。这是因为Ajax.Updater执行脚本是通过eval的方式,而不是将脚本内容引入到当前页面,直接声明的function sayHi或者用var声明的sayHi函数Q其作用域只是在q段脚本内部Q外部的其他脚本不能讉KsayHi函数。而按照例2-13的方式声明的函数Q其作用域是整个window?/p>

2.3.5  Ajax.PeriodicalUpdaterc?/h3>

和Ajax.Requestcȝ|Ajax.PeriodicalUpdatercMl承自Ajax.BasecR在一些Ajax应用中,需要周期性地更新某些面元素Q例如天气预报、即时新ȝ{。实现这L功能通常要用JavaScript中的定时器函数setTimeout、clearTimeout{,而有了Ajax.PeriodicalUpdatercd以很好地化这cȝ码工作?/p>

新徏一个Ajax. PeriodicalUpdatercȝ实例需要指?个参敎ͼ

l  containerQ将要更新的面元素idQ?/p>

l  urlQ请求的URL地址Q?/p>

l  optionsQAjax操作选项?/p>

和Ajax.Updatercȝ|Ajax.PeriodicalUpdatercM支持动态执行JavaScript脚本Q只需在Ajax操作选项中增加(evalScripts: trueQ属性值即可?/p>

Ajax.PeriodicalUpdatercL持两个特D的Ajax操作选项Qfrequency和decay。frequency参数很容易理解,既然是定时更新页面元素,或者定时执行脚本,那么多长旉更新或者执行一ơ呢Qfrequency指的是两次Ajax操作之间的时间间隔,单位是秒Q默认gؓ2U?/p>

如果仅指定frequency参数Q程序会按照固定的时间间隔执行Ajax操作。这L更新{略合理吗?{案取决于请求URL中数据的更新频率。如果请求的数据会很有规律地按照固定频率改变Q那么只要设|一个合适的frequency|可以很有效地实现页面的定时更新。然而实际应用中的数据往往不会那么理想Q例如新闻,可能在一天中只有特定的一D|间更新频率会很高Q而在其他旉则几乎没有变化。经帔R到这L情况该怎么办呢QAjax.PeriodicalUpdatercL持的decay属性就是ؓ了解册个问题而生的。当option中带有decay属性时Q如果请求返回的数据与上ơ相同,那么下次q行Ajax操作的时间间隔会乘以一个decay的系数?/p>

Z比较明显地看到decay属性的效果Q在h的测试页面中加入记录旉的脚本,代码如例2-14所C?/p>

?-14  Ajax.PeriodicalUpdatercd用示?/p>

ex10.htmlQ?/strong>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

    <head>

        <title>chapter 3</title>

        <script type="text/javascript" language="javascript"

         src="prototype.js" ></script>

        <script type="text/javascript" language="javascript">

        var str='';

        var intcount=0;

        function test() {

            var myAjax = new Ajax.PeriodicalUpdater(

                'divResult', // 定时更新的页面元?/p>

                'script1.html', // h的URL

                {

                    method: 'get', // HTTPh的方式ؓGET

                    evalScripts: true, // 是否执行h面中的脚本

                    frequency: 1, // 更新的频?/p>

                    decay: 1 // 衰减pL

                }

            );

        }

        </script>

    </head>

    <body>

    <input type="button" value="click" onclick="test()" />

    <div id="divResult" ></div>

    <div id="divResult2" ></div>

    </body>

</html>

script1.html:

<script language="javascript" type="text/javascript">

// Ajax.PeriodicalUpdater调用函数计数

// ?lt;div>元素divResult2中增加一行结果,q记录当前时间和

// Ajax.PeriodicalUpdater的调用次?/p>

intcount++;

str = $('divResult2').innerHTML;

$('divResult2').innerHTML = str + "count = " + intcount+ ": " + new Date() + "<br>";

</script>

?-14的运行结果如?-4所C?/p>

?-4  Ajax.PeriodicalUpdatercd用示?/p>

可以看到Q由于请求返回的数据一直没有发生变化,每次h旉的间隔是上一ơ的2倍(decay=2Q。如果某一ơ请求返回的数据发生了变化,那么执行h的时间间隔则恢复到初始倹{?/p>

2.3.6  Ajax.Responders对象

Ajax.Responders对象l护了一个正在运行的Ajax对象列表Q在需要实C些全局的功能时可以用它。例如,在Ajaxh发出以后需要提C用h作正在执行中Q而操作返回以后则取消提示。利用Ajax.Responders对象可以实现这L功能Q如?-15所C?/p>

?-15  Ajax.Responders对象应用CZ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

    <head>

        <title>chapter 3</title>

        <script type="text/javascript" language="javascript"

         src="prototype.js" ></script>

        <script type="text/javascript" language="javascript">

        function test() {

            var myAjax = new Ajax.Request(

                'data.html',

                {

                    method: 'get',

                    onComplete: showResponse

                }

            );

        }

        function showResponse(response) {

            $('divResult').innerHTML = response.responseText;

        }      

        var handle = {

            onCreate: function() {

                Element.show('loading'); // 当创建AjaxhӞ昄loading

            },

            onComplete: function() {

                // 当请求成功返回时Q如果当前没有其他正在运行中的AjaxhQ隐藏loading

                if (Ajax.activeRequestCount == 0) {

                    Element.hide('loading');

                }

            }

        };

        // handle注册到全局的Ajax.Responders对象中,使其生效

        Ajax.Responders.register(handle);

        </script>

    </head>

    <body>

    <input type="button" value="click" onclick="test()" />

    <div id="divResult" ></div>

    <div id='loading' style="display:none">

        <img src="loading.gif">Loading...

    </div>

    </body>

</html>

?-15中定义了一个handle对象Q其中包含onCreate和onComplete函数。页面中发出M一个Ajaxh旉会调用onCreateҎQ而请求完成时都会调用onCompleteҎ。例2-15的运行结果如?-5所C?br />



feingto 2007-12-30 18:03 发表评论
]]>对xmlq行增、删、改的很好例?/title><link>http://www.tkk7.com/feingto/archive/2007/12/29/171559.html</link><dc:creator>feingto</dc:creator><author>feingto</author><pubDate>Sat, 29 Dec 2007 07:44:00 GMT</pubDate><guid>http://www.tkk7.com/feingto/archive/2007/12/29/171559.html</guid><wfw:comment>http://www.tkk7.com/feingto/comments/171559.html</wfw:comment><comments>http://www.tkk7.com/feingto/archive/2007/12/29/171559.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/feingto/comments/commentRss/171559.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/feingto/services/trackbacks/171559.html</trackback:ping><description><![CDATA[rule.hta<br /> ================<br /> <br /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"><br /> <HTML><br /> <HEAD><br /> <TITLE>XML Editer</TITLE><br /> <HTA:APPLICATION ID="oHTA"<br /> APPLICATIONNAME="myApp"<br /> BORDER="thick"<br /> BORDERSTYLE="normal"<br /> CAPTION="yes"<br /> ContextMenu="yes"<br /> ICON=""<br /> MAXIMIZEBUTTON="yes"<br /> MINIMIZEBUTTON="yes"<br /> scroll="no"<br /> selection="no"<br /> SHOWINTASKBAR="yes"<br /> SINGLEINSTANCE="yes"<br /> SYSMENU="yes"<br /> VERSION="1.0"<br /> WINDOWSTATE="normal"<br /> ><br /> <br /> <style type="text/css"><br /> </style><br /> </HEAD><br /> <br /> <script language="javascript"><br /> <br /> // load the xml file<br /> var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");<br /> xmlDoc.async = false;<br /> xmlDoc.resolveExternals = false;<br /> xmlDoc.load("rule.xml");<br /> <br /> // load the xsl file<br /> var xslDoc = new ActiveXObject("Msxml2.FreeThreadedDOMDocument");<br /> xslDoc.async = false;<br /> xslDoc.resolveExternals = false;<br /> xslDoc.load("rule.xsl");<br /> <br /> // create the xslt object<br /> var xslt = new ActiveXObject("Msxml2.XSLTemplate");<br /> xslt.stylesheet = xslDoc;<br /> var xslProc = xslt.createProcessor();<br /> xslProc.input = xmlDoc;<br /> <br /> var checked_count = 0;<br /> var cur_page = 1;<br /> var total_page = 1;<br /> <br /> function OutputDocument(number){<br /> xslProc.addParameter("ename", number);<br /> xslProc.addParameter("startno", (cur_page - 1)*10);<br /> xslProc.addParameter("endno", cur_page*10);<br /> xslProc.transform();<br /> <br /> return xslProc.output;<br /> }<br /> <br /> function delete_node(node){<br /> if( node.hasChildNodes() ) { <br /> var kids = node.childNodes; <br /> for(var i=0;i<kids.length;i++) { <br /> delete_node(kids);<br /> }<br /> }<br /> node.parentNode.removeChild(node);<br /> }<br /> <br /> function delete_rule(id){<br /> var node = xmlDoc.selectSingleNode("/rules/rule[event/id="+id+"]");<br /> delete_node(node);<br /> }<br /> <br /> function modify_node(node){<br /> node.selectSingleNode("event/id").text = modify_id.value;<br /> node.selectSingleNode("event/name").text = modify_name.value;<br /> if( modify_state.checked ) {<br /> node.selectSingleNode("enable").text = "true";<br /> } else {<br /> node.selectSingleNode("enable").text = "false";<br /> }<br /> }<br /> <br /> function modify_rule(id){<br /> var node = xmlDoc.selectSingleNode("/rules/rule[event/id="+id+"]");<br /> modify_node(node);<br /> }<br /> <br /> function add_rule(){<br /> var id = xmlDoc.createElement("id");<br /> id.appendChild(xmlDoc.createTextNode(add_id.value));<br /> var name = xmlDoc.createElement("name");<br /> name.appendChild(xmlDoc.createTextNode(add_name.value));<br /> <br /> var event = xmlDoc.createElement("event");<br /> event.appendChild(id);<br /> event.appendChild(name);<br /> <br /> var enable = xmlDoc.createElement("enable");<br /> if( add_state.checked ) {<br /> enable.appendChild(xmlDoc.createTextNode("true"));<br /> } else {<br /> enable.appendChild(xmlDoc.createTextNode("false"));<br /> }<br /> <br /> var rule = xmlDoc.createElement("rule");<br /> rule.appendChild(event);<br /> rule.appendChild(enable);<br /> <br /> var parent = xmlDoc.selectSingleNode("/rules");<br /> if( parent.hasChildNodes() ) {<br /> parent.insertBefore(rule, parent.firstChild);<br /> } else {<br /> parent.appendChild(rule);<br /> }<br /> }<br /> <br /> function gotoPage(pageno){<br /> if( pageno < 1 ) {<br /> cur_page = 1;<br /> } else if( pageno >= total_page ) {<br /> cur_page = total_page;<br /> } else {<br /> cur_page = pageno;<br /> }<br /> Transform();<br /> }<br /> <br /> function saveXML(){<br /> xmlDoc.save("rule.xml");<br /> }<br /> <br /> function protectsubmit(val){<br /> if( val == 1 ) { //add<br /> if( add_id.value < 10000 || add_name.value == "" ) {<br /> window.alert("事g号必L5位整C事g名不能ؓI?);<br /> } else if( xmlDoc.selectSingleNode("/rules/rule/event/id[. = " + add_id.value + "]") ) {<br /> window.alert("事g? + add_id.value + "已经存在");<br /> } else {<br /> add_rule();<br /> saveXML();<br /> Transform();<br /> }<br /> } else if( val == 2 ) { //modify<br /> var id = viewTable.rows[getFirstCheckedLine()].cells[2].innerText;<br /> if( modify_id.value < 10000 || modify_name.value == "" ) {<br /> window.alert("事g号必L5位整C事g名不能ؓI?);<br /> } else if( id != modify_id.value && xmlDoc.selectSingleNode("/rules/rule/event/id[. = " + modify_id.value + "]") ) {<br /> window.alert("事g? + modify_id.value + "已经存在");<br /> } else {<br /> if( confirm("认修改Q?) ) {<br /> modify_rule(id);<br /> saveXML();<br /> Transform();<br /> }<br /> }<br /> } else if( val == 3 ) { //delete<br /> if( !confirm("认删除Q?) ) {<br /> return;<br /> }<br /> for( var i = 1; i < viewTable.rows.length; i++ ) {<br /> var id = viewTable.rows.cells[2].innerText;<br /> if( eval("viewchk_" + id + ".checked") == true ) {<br /> delete_rule(id)<br /> }<br /> }<br /> saveXML();<br /> Transform();<br /> } else if( val == 4 ) { //select all<br /> checked_count = viewTable.rows.length - 1;<br /> for( var i = 1; i < viewTable.rows.length; i++ ) {<br /> var id = viewTable.rows.cells[2].innerText;<br /> eval("viewchk_" + id + ".checked = true");<br /> }<br /> changeState();<br /> } else if( val == 5 ) { //cancel all<br /> checked_count = 0;<br /> for( var i = 1; i < viewTable.rows.length; i++ ) {<br /> var id = viewTable.rows.cells[2].innerText;<br /> eval("viewchk_" + id + ".checked = false");<br /> }<br /> changeState();<br /> }<br /> }<br /> <br /> function getFirstCheckedLine(){<br /> for( var i = 1; i < viewTable.rows.length; i++ ) {<br /> var id = viewTable.rows.cells[2].innerText;<br /> if( eval("viewchk_" + id + ".checked") == true ) {<br /> return i;<br /> }<br /> }<br /> return 0;<br /> }<br /> <br /> function checkOVItem(val){<br /> if( eval("viewchk_" + val+".checked") == true ) {<br /> checked_count++;<br /> } else {<br /> checked_count--;<br /> }<br /> changeState();<br /> }<br /> <br /> function changeState(){<br /> if( checked_count ) {<br /> delete_btn.disabled = false;<br /> cancel_all_btn.disabled = false;<br /> } else {<br /> delete_btn.disabled = true;<br /> cancel_all_btn.disabled = true;<br /> }<br /> if( (checked_count + 1) == viewTable.rows.length ) {<br /> select_all_btn.disabled = true;<br /> } else {<br /> select_all_btn.disabled = false;<br /> }<br /> <br /> if( checked_count == 1 ) {<br /> modify_btn.disabled = false;<br /> modify_id.disabled = false;<br /> modify_name.disabled = false;<br /> modify_state.disabled = false;<br /> var id = getFirstCheckedLine();<br /> modify_id.value = viewTable.rows(id).cells(2).innerText;<br /> modify_name.value = viewTable.rows(id).cells(3).innerText;<br /> if( viewTable.rows(id).cells(1).innerText == "有效" ) {<br /> modify_state.checked = true;<br /> } else {<br /> modify_state.checked = false;<br /> }<br /> } else {<br /> modify_btn.disabled = true;<br /> modify_id.disabled = true;<br /> modify_name.disabled = true;<br /> modify_state.disabled = true;<br /> modify_id.value="请选择一条规?;<br /> modify_name.value="请选择一条规?;<br /> }<br /> }<br /> <br /> function showPageInfo(){<br /> if( total_item.value == 0 ) {<br /> total_page = 1;<br /> } else {<br /> total_page = Math.floor((9 + parseInt(total_item.value)) / 10);<br /> }<br /> var txt = " ?+total_item.value+"条记?;<br /> var prev_page = cur_page - 1;<br /> var next_page = parseInt(cur_page) + 1;<br /> if( cur_page > 1 ) {<br /> txt += " <input type='button' value='<' onClick='gotoPage(" + prev_page + ")'/>"<br /> } else {<br /> txt += " <input type='button' value='<' onClick='gotoPage(" + prev_page + ")' disabled/>"<br /> }<br /> if( cur_page < total_page ) {<br /> txt += " <input type='button' value='>' onClick='gotoPage(" + next_page + ")'/>"<br /> } else {<br /> txt += " <input type='button' value='>' onClick='gotoPage(" + next_page + ")' disabled/>"<br /> }<br /> <br /> txt += " W?lt;input type='text' id='page_number' size='4' maxlength='4' value='" + cur_page + "' onBlur='gotoPage(this.value)'/>?nbsp;? + total_page + "?;<br /> page_info.innerHTML = txt;<br /> // window.alert(txt);<br /> }<br /> <br /> function Transform(){<br /> var txt = document.getElementById("ename").value;<br /> var str = OutputDocument(txt);<br /> rule_list.innerHTML = str;<br /> checked_count = 0;<br /> showPageInfo();<br /> changeState();<br /> // window.alert(str);<br /> }<br /> </script><br /> <br /> <BODY onLoad="Transform()"><br /> <br /> <table width="550" border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse;"><br /> <tr><br /> <td><br /> <table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;"><br /> <TR height=5><td colspan=10 style="font-size:0px;"></td></TR><br /> <TR height=25><br /> <td colspan=3 align=center>事g名包?</td><br /> <td colspan=3 align=center><input type="text" value="" id="ename" size="35" maxlength="16"/></td><br /> <td colspan=4><input type="button" value="搜烦" onClick="Transform()"/></td><br /> </TR><br /> <TR height=1><td colspan=10 bgcolor=#2b7297></td></TR><br /> <TR height=30><br /> <td width=45 align=center><b>d</b></td><br /> <td width=5 align=center><font color=gray>|</font></td><br /> <td width=50 align=center>事g?lt;/td><br /> <td width=55 align=center><input type="text" name="add_id" value="" size="5" maxlength="5" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"></td><br /> <td width=55 align=center>事g?lt;/td><br /> <td width=* align=center><input type="text" name="add_name" maxlength="48" value=""></td><br /> <td width=70 align=center>是否使用</td><br /> <td width=30 align=center><br /> <input type='checkbox' name='add_state' checked><br /> </td> <br /> <td width=5 align=center><font color=gray>|</font></td><br /> <td width=70 align=center><input type="button" name="add_btn" value="定" onClick="protectsubmit(1)"></td><br /> </TR><br /> <TR height=1><td colspan=10 bgcolor=#2b7297></td></TR><br /> <TR height=30><br /> <td width=45 align=center><b>修改</b></td><br /> <td width=5 align=center><font color=gray>|</font></td><br /> <td width=50 align=center>事g?lt;/td><br /> <td width=55 align=center><br /> <input type="text" name="modify_id" value="<请选择一条规?gt;" size="5" maxlength="5" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" disabled></td><br /> <td width=55 align=center>事g?lt;/td><br /> <td width=* align=center><br /> <input type="text" name="modify_name" maxlength="48" value="<请选择一条规?gt;" disabled></td><br /> <td width=70 align=center>是否使用</td><br /> <td width=30 align=center><br /> <input type='checkbox' name='modify_state' disabled><br /> </td> <br /> <td width=5 align=center><font color=gray>|</font></td><br /> <td width=70 align=center><input type="button" name="modify_btn" value="定" onClick="protectsubmit(2)"></td><br /> </TR><br /> <TR height=1><td colspan=10 bgcolor=#2b7297></td></TR><br /> <TR height=30><br /> <td colspan=5 align=left class=tablefont></td><br /> <td align=right><input type="button" name="select_all_btn" value="全部选择" onClick="protectsubmit(4)"></td><br /> <td colspan=2 align=right><input type="button" name="cancel_all_btn" value="全部不? onClick="protectsubmit(5)" disabled></td><br /> <td align=center></td><br /> <td align=center><input type="button" name="delete_btn" value="删除" onClick="protectsubmit(3)" disabled></td><br /> </TR><br /> <TR height=30><td colspan=4>规则列表</td><TD colspan=6 align=right><div id="page_info" name="page_info"/></TR><br /> <TR><br /> <TD colspan=10><div id="rule_list" name="rule_list"/></TD><br /> </TR><br /> <TR height=5><td colspan=10></td></TR><br /> </table><br /> </td><br /> </tr><br /> <tr><br /> </tr><br /> </table><br /> <br /> </BODY><br /> </HTML><br /> <br /> <br /> rule.xml<br /> ============<br /> <?xml version="1.0" encoding="GB2312"?><br /> <?xml:stylesheet type="text/xsl" href="rule.xsl"?><br /> <rules><br /> <rule><br /> <event><br /> <id>10001</id><br /> <name>TFTP下蝲文g</name><br /> </event><br /> <enable>false</enable><br /> </rule><br /> <rule><br /> <event><br /> <id>10002</id><br /> <name>TFTP上传文g</name><br /> </event><br /> <enable>false</enable><br /> </rule><br /> <rule><br /> <event><br /> <id>10003</id><br /> <name>telnetd成功</name><br /> </event><br /> <enable>false</enable><br /> </rule><br /> <br /> </rules><br /> <br /> rule.xsl<br /> =============<br /> <?xml version="1.0" encoding="GB2312"?><br /> <xsl:stylesheet version="1.0" xmlns:xsl="<a target="_blank">http://www.w3.org/1999/XSL/Transform</a>"><br /> <xsl:strip-space elements="*"/><br /> <xsl:output method= "html"/><br /> <xsl:param name="ename">undefined</xsl:param><br /> <xsl:param name="startno">undefined</xsl:param><br /> <xsl:param name="endno">undefined</xsl:param><br /> <br /> <xsl:template match="/"><br /> <html><br /> <body><br /> <xsl:apply-templates select="rules"/><br /> </body><br /> </html><br /> </xsl:template><br /> <br /> <xsl:template match="rules"><br /> <input type="hidden" name="total_item"><br /> <xsl:attribute name="value"><xsl:value-of select="count(rule[contains(event/name, $ename)])"/></xsl:attribute><br /> </input><br /> <TABLE id="viewTable" name="viewTable" width="100%" border="1" bordercolor="#85979f" cellSpacing="0" cellPadding="0" style="border-collapse:collapse;"><br /> <tr height="25"><br /> <TD width="10%" align="center">选择</TD><br /> <TD width="10%" align="center">状?lt;/TD><br /> <TD width="10%" align="center">事g?lt;/TD><br /> <TD width="*" align="center">事g?lt;/TD><br /> </tr><br /> <br /> <xsl:for-each select='rule[contains(event/name, $ename)]'><br /> <xsl:sort select="event/id"/><br /> <xsl:if test="position()> $startno and position()<= $endno"><br /> <tr><br /> <td align="center"><br /> <input type='checkbox'><br /> <xsl:attribute name="name">viewchk_<xsl:value-of select="event/id"/></xsl:attribute><br /> <xsl:attribute name="value"><xsl:value-of select="event/id"/></xsl:attribute><br /> <xsl:attribute name="onClick">checkOVItem(<xsl:value-of select="event/id"/>)</xsl:attribute><br /> </input><br /> </td><br /> <xsl:choose><br /> <xsl:when test="enable[. = 'true']"><br /> <td align="center">有效</td><br /> </xsl:when><br /> <xsl:otherwise><br /> <td align="center">用</td><br /> </xsl:otherwise><br /> </xsl:choose><br /> <td align="center"><xsl:value-of select="event/id"/></td><br /> <td><xsl:value-of select="event/name"/></td><br /> </tr><br /> </xsl:if><br /> </xsl:for-each><br /> </TABLE><br /> </xsl:template><br /> <br /> </xsl:stylesheet><br /> <img src ="http://www.tkk7.com/feingto/aggbug/171559.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/feingto/" target="_blank">feingto</a> 2007-12-29 15:44 <a href="http://www.tkk7.com/feingto/archive/2007/12/29/171559.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>prototype.js 1.4版开发者手?强烈推荐) http://www.tkk7.com/feingto/archive/2007/12/29/171538.htmlfeingtofeingtoSat, 29 Dec 2007 06:59:00 GMThttp://www.tkk7.com/feingto/archive/2007/12/29/171538.htmlhttp://www.tkk7.com/feingto/comments/171538.htmlhttp://www.tkk7.com/feingto/archive/2007/12/29/171538.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/171538.htmlhttp://www.tkk7.com/feingto/services/trackbacks/171538.html阅读全文

feingto 2007-12-29 14:59 发表评论
]]>
showModalDialog/showModelessDialog实例,父窗口向子窗口传递?子窗口设|父H口的?子窗口关闭的时候返回值到父窗?关闭h父窗?/title><link>http://www.tkk7.com/feingto/archive/2007/12/29/171522.html</link><dc:creator>feingto</dc:creator><author>feingto</author><pubDate>Sat, 29 Dec 2007 06:33:00 GMT</pubDate><guid>http://www.tkk7.com/feingto/archive/2007/12/29/171522.html</guid><wfw:comment>http://www.tkk7.com/feingto/comments/171522.html</wfw:comment><comments>http://www.tkk7.com/feingto/archive/2007/12/29/171522.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/feingto/comments/commentRss/171522.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/feingto/services/trackbacks/171522.html</trackback:ping><description><![CDATA[<div id="k8ceyic" class="postTitle">下面是showModalDialog/showModelessDialog使用例子,父窗口向子窗口传递?子窗口设|父H口的?子窗口关闭的时候返回值到父窗?关闭h父窗?希望对象我这LWEB开发的菜鸟有所帮助.<br /> <span style="color: red"><strong><br /> (一)showModalDialog使用例子,父窗口向子窗口传递?子窗口设|父H口的?子窗口关闭的时候返回值到父窗?</strong></span> <br /> <br /> <span style="color: red">farther.html</span> <br /> --------------------------- <br /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <br /> <HTML> <br /> <HEAD> <br /> <TITLE> New Document </TITLE> <br /> <META NAME="Generator" CONTENT="EditPlus"> <br /> <META NAME="Author" CONTENT=""> <br /> <META NAME="Keywords" CONTENT=""> <br /> <META NAME="Description" CONTENT=""> <br /> <script language="javascript"> <br /> <!-- <br /> function openChild(){ </div> <div id="aq8o00i" class="postText"> <p>var k = window.showModalDialog("child.html",window,"dialogWidth:335px;status:no;dialogHeight:300px"); <br /> if(k != null) <br /> document.getElementById("txt11").value = k; <br /> } <br /> //--> <br /> </script> <br /> </HEAD> </p> <p><BODY> <br /> <br>传递到父窗口的?<input id="txt9" type="text" value="3333333333333"><br> <br /> q回的?<input id="txt11" type="text"><br> <br /> 子窗口设|的?<input id="txt10" type="text"><br> </p> <p><br /> <input type ="button" value="openChild" onclick="openChild()"> <br /> </BODY> <br /> </HTML> <br /> --------------------------------------------------------------- <br /> <span style="color: red">child.html</span> <br /> -------- <br /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <br /> <HTML> <br /> <HEAD> <br /> <TITLE> New Document </TITLE> <br /> <META NAME="Generator" CONTENT="EditPlus"> <br /> <META NAME="Author" CONTENT=""> <br /> <META NAME="Keywords" CONTENT=""> <br /> <META NAME="Description" CONTENT=""> <br /> <meta http-equiv="Expires" CONTENT="0"> <br /> <meta http-equiv="Cache-Control" CONTENT="no-cache"> <br /> <meta http-equiv="Pragma" CONTENT="no-cache"> </p> <p></HEAD></p> <p><BODY> <br /> <br>父窗口传递来的?<input id="txt0" type="text"><br> <br /> 输入要设|父H口的?<input id="txt1" type="text"><input type ="button" value="讄父窗口的? onclick="setFather()"><br> <br /> 输入q回的?<input id="txt2" type="text"><input type ="button" value="关闭切返回? onclick="retrunValue()"> <br /> <input type ="button" value="关闭h父窗? onclick=""> </p> <p></BODY> <br /> </HTML> </p> <p><script language=javascript> <br /> <!-- <br /> var k=window.dialogArguments; <br /> //获得父窗口传递来的?<br /> if(k!=null) <br />  { <br />  document.getElementById("txt0").value = k.document.getElementById("txt9").value; <br />  } <br />  //讄父窗口的?<br /> function setFather() <br /> { <br />  k.document.getElementById("txt10").value = document.getElementById("txt1").value <br /> } <br /> //讄q回到父H口的?<br /> function retrunValue() <br /> { <br /> var s = document.getElementById("txt2").value; <br /> window.returnValue=s; <br /> window.close(); <br /> } <br /> //--> <br /> </script> <br /> <br /> ---------------------------- <br /> <span style="color: red">说明:</span> <br /> ׃showModalDialog~存严重,下面是在子窗口取消客L~存的设|?也可以在服务器端取消~存,参? <br /> <a ><font color="#000080">http://adandelion.cnblogs.com/articles/252137.html</font></a> <br /> <meta http-equiv="Expires" CONTENT="0"> <br /> <meta http-equiv="Cache-Control" CONTENT="no-cache"> <br /> <meta http-equiv="Pragma" CONTENT="no-cache"> <br /> ------------------------------------------------------------------------------------------------------------------------ <br /> <span style="color: #000000"><span style="color: #ff0000"><span style="color: #ff0000"><strong>(<span style="color: #ff0000">?下面是关闭刷新父H口的例</span>?/strong></span></span> <br /> <br /> <span style="color: #ff0000">farther.html</span> <br /> --------------------------- <br /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <br /> <HTML> <br /> <HEAD> <br /> <TITLE> New Document </TITLE> <br /> <META NAME="Generator" CONTENT="EditPlus"> <br /> <META NAME="Author" CONTENT=""> <br /> <META NAME="Keywords" CONTENT=""> <br /> <META NAME="Description" CONTENT=""> <br /> <script language="javascript"> <br /> <!-- <br /> function openChild() <br /> {</span> </p> <p><span style="color: #000000"> var k = window.showModalDialog("child.html",window,"dialogWidth:335px;status:no;dialogHeight:300px"); <br />  if(k == 1)//判断是否h <br />  { <br />   alert('h'); <br />   window.location.reload(); <br />  } <br /> } <br /> //--> <br /> </script> <br /> </HEAD></span> </p> <p><span style="color: #000000"><BODY> <br /> <br>传递到父窗口的?<input id="txt9" type="text" value="3333333333333"><br> <br /> <input type ="button" value="openChild" onclick="openChild()"> <br /> </BODY> <br /> </HTML> <br /> ---------------------------------------------------- <br /> <span style="color: #ff0000">child.html</span> <br /> -------- <br /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <br /> <HTML> <br /> <HEAD> <br /> <TITLE> New Document </TITLE> <br /> <META NAME="Generator" CONTENT="EditPlus"> <br /> <META NAME="Author" CONTENT=""> <br /> <META NAME="Keywords" CONTENT=""> <br /> <META NAME="Description" CONTENT=""> <br /> <meta http-equiv="Expires" CONTENT="0"> <br /> <meta http-equiv="Cache-Control" CONTENT="no-cache"> <br /> <meta http-equiv="Pragma" CONTENT="no-cache"> </span></p> <p><span style="color: #000000"></HEAD></span> </p> <p><span style="color: #000000"><BODY> <br /> <br>父窗口传递来的?<input id="txt0" type="text"><br></span> </p> <p><span style="color: #000000"><input type ="button" value="关闭h父窗? onclick="winClose(1)"> <br /> <input type ="button" value="关闭不刷新父H口" onclick="winClose(0)"></span> </p> <p><span style="color: #000000"></BODY> <br /> </HTML></span> </p> <p><span style="color: #000000"><script language=javascript> <br /> <!-- <br /> var k=window.dialogArguments; <br /> //获得父窗口传递来的?<br /> if(k!=null) <br />  { <br />  document.getElementById("txt0").value = k.document.getElementById("txt9").value; <br />  }</span> </p> <span style="color: #000000"> <p>//关闭H口q回是否h的参? <br /> function winClose(isRefrash) <br /> { </p> <p>window.returnValue=isRefrash; <br /> window.close(); <br /> } <br /> //--> <br /> </script> </p> <p>-------------------------- <br /> <span style="color: red">说明</span> <br /> 1.下面是取消客L~存? <br /> <meta http-equiv="Expires" CONTENT="0"> <br /> <meta http-equiv="Cache-Control" CONTENT="no-cache"> <br /> <meta http-equiv="Pragma" CONTENT="no-cache"> <br /> 也可以在服务器端取消~存,参? <br /> <a ><font color="#000080">http://adandelion.cnblogs.com/articles/252137.html</font></a> </p> <p>2.向父H口传递阐q在ASP.NET中也可以是用aaa.aspx?id=1的方式传? <br /> <br /> 3.不刷新父H口的话在父H口中直接这样一来设|可? <br /> <script> <br /> window.showModalDialog("child.html",window,"dialogWidth:335px;status:no;dialogHeight:300px"); <br /> </script> <br /> 4.在子H口中若要提交页面的话要加入:,q样׃会打开新窗口了.<br /> <head><br /> <base target="_self"><br /> </HEAD><br /> <br /> <span style="color: red">本文参考了:<a ><font color="#000080">http://dev.csdn.net/develop/article/15/15113.shtm</font></a> ,里面有showModalDialog/showModelessDialog的详l用说?/span></p> </span></div> <img src ="http://www.tkk7.com/feingto/aggbug/171522.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/feingto/" target="_blank">feingto</a> 2007-12-29 14:33 <a href="http://www.tkk7.com/feingto/archive/2007/12/29/171522.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>制作Javascript弹出H口技巧九?http://www.tkk7.com/feingto/archive/2007/12/29/171516.htmlfeingtofeingtoSat, 29 Dec 2007 06:24:00 GMThttp://www.tkk7.com/feingto/archive/2007/12/29/171516.htmlhttp://www.tkk7.com/feingto/comments/171516.htmlhttp://www.tkk7.com/feingto/archive/2007/12/29/171516.html#Feedback0http://www.tkk7.com/feingto/comments/commentRss/171516.htmlhttp://www.tkk7.com/feingto/services/trackbacks/171516.html  1、最基本的弹出窗口代?
  其实代码非常单:
  < SCRIPT LANGUAGE="javascript">
  < !--
  window.open ("page.html")
  -->
  < /SCRIPT>
  因ؓq是一DJavascript代码Q所以它们应该放?lt; SCRIPT LANGUAGE="javascript">之间?< !-- ?-->是对一些版本低的浏览器起作用,在这些老浏览器中不会将标签中的代码作ؓ文本昄出来。要Lq个好习惯啊?
  window.open ("page.html") 用于控制弹出新的H口page.htmlQ如果page.html不与ȝ口在同一路径下,前面应写明\径,l对路径(http://)和相对\?../)均可?
  用单引号和双引号都可以,只是不要L?
  q一D代码可以加入HTML的Q意位|,< head>?lt; /head>之间可以Q?lt; body>?lt; /body>也可以,前早执行Q尤其是面代码长,又想佉K面早点弹出就量往前放?也可以,前早执行Q尤其是面代码长,又想佉K面早点弹出就量往前放?

  2、经q设|后的弹出窗?/strong>
  下面再说一说弹出窗口的讄。只要再往上面的代码中加一点东西就可以了。我们来定制q个弹出的窗口的外观Q尺寸大,弹出的位|以适应该页面的具体情况?
  < SCRIPT LANGUAGE="javascript">
  < !--
  window.open ("page.html", "newwindow", "height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no")
  //写成一?br />   -->
  < /SCRIPT>
  参数解释Q?
  < SCRIPT LANGUAGE="javascript"> js脚本开始;
  window.open 弹出新窗口的命oQ?br />   "page.html" 弹出H口的文件名Q?br />   "newwindow" 弹出H口的名字(不是文g名)Q非必须Q可用空"代替Q?br />   height=100 H口高度Q?br />   width=400 H口宽度Q?br />   top=0 H口距离屏幕上方的象素|
  left=0 H口距离屏幕左侧的象素|
  toolbar=no 是否昄工具栏,yes为显C;
  menubarQscrollbars 表示菜单栏和滚动栏?br />   resizable=no 是否允许改变H口大小Qyes为允许;
  location=no 是否昄地址栏,yes为允许;
  status=no 是否昄状态栏内的信息Q通常是文件已l打开Q,yes为允许;
  < /SCRIPT> js脚本l束

  3、用函数控制弹出H口
  下面是一个完整的代码Q?
  < html>
  < head>
  < script LANGUAGE="JavaScript">
  < !--
  function openwin() {
  window.open ("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
  //写成一?br />   }
  //-->
  < /script>
  < /head>
  < body onload="openwin()">
  ...L的页面内?..
  < /body>
  < /html>
  q里定义了一个函数openwin(),函数内容是打开一个窗口。在调用它之前没有Q何用途?br />   怎么调用呢?
  Ҏ一Q?lt; body onload="openwin()"> 览器读面时弹出窗口;
  Ҏ二:< body onunload="openwin()"> 览器离开面时弹出窗口;
  Ҏ三:用一个连接调用:< a href="#" onclick="openwin()">打开一个窗?lt; /a>
  注意Q用的"#"是虚q接?br />   Ҏ四:用一个按钮调用:< input type="button" onclick="openwin()" value="打开H口">

  4、同时弹?个窗?/strong>
  Ҏ代码E微改动一下:
  < script LANGUAGE="JavaScript">
  < !--
  function openwin() {
  window.open ("page.html", "newwindow", "height=100, width=100, top=0, left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
  //写成一?br />   window.open ("page2.html", "newwindow2", "height=100, width=100, top=100, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
  //写成一?br />   }
  //-->
  < /script>
  为避免弹出的2个窗口覆盖,用top和left控制一下弹出的位置不要怺覆盖卛_。最后用上面说过的四U方法调用即可?br />   注意Q?个窗口的name(newwindows和newwindow2)不要相同Q或者干脆全部ؓI。OKQ?/p>

  5、主H口打开文g1.htmQ同时弹出小H口page.html
  如下代码加入ȝ?lt; head>区:
  < script language="javascript">
  < !--
  function openwin() {
  window.open("page.html","","width=200,height=200")
  }
  //-->
  < /script>
  加入< body>区:
  < a href="1.htm" onclick="openwin()">open< /a>卛_

  6、弹出的H口之定时关闭控?/strong>
  下面我们再对弹出的窗口进行一些控Ӟ效果更好了。如果我们再一段代码加入弹出的页?注意是加入到page.html的HTML中,可不是主面中,否则...)Q让?0U后自动关闭是不是更酷了Q?
  首先Q将如下代码加入page.html文g?lt; head>区:
  < script language="JavaScript">
  function closeit() {
  setTimeout("self.close()",10000) //毫秒
  }
  < /script>
  然后Q再?lt; body onload="closeit()"> q一句话代替page.html中原有的< BODY>q一句就可以了?q一句话千万不要忘记写啊Q这一句的作用是调用关闭窗口的代码Q?0U钟后就自行关闭该窗口?

  7、在弹出H口中加上一个关闭按?/strong>
  < FORM>
  < INPUT TYPE="BUTTON" VALUE="关闭" onClick="window.close()">
  < /FORM>
  呵呵Q现在更加完了Q?

  8、内包含的弹出窗?Q-一个页面两个窗?/strong>
  上面的例子都包含两个H口Q一个是ȝ口,另一个是弹出的小H口。通过下面的例子,你可以在一个页面内完成上面的效果?
  < html>
  < head>
  < SCRIPT LANGUAGE="JavaScript">
  function openwin()
  {
  OpenWindow=window.open("", "newwin", "height=250, width=250,toolbar=no,scrollbars="+scroll+",menubar=no");
  //写成一?br />   OpenWindow.document.write("< TITLE>例子< /TITLE>")
  OpenWindow.document.write("< BODY BGCOLOR=#ffffff>")
  OpenWindow.document.write("< h1>Hello!< /h1>")
  OpenWindow.document.write("New window opened!")
  OpenWindow.document.write("< /BODY>")
  OpenWindow.document.write("< /HTML>")
  OpenWindow.document.close()
  }
  < /SCRIPT>
  < /head>
  < body>
  < a href="#" onclick="openwin()">打开一个窗?lt; /a>
  < input type="button" onclick="openwin()" value="打开H口">
  < /body>
  < /html>
  看看OpenWindow.document.write()里面的代码不是标准的HTML吗?只要按照格式写更多的行即可。千万注意多一个标{或一个标{ְ会出现错误。记得用OpenWindow.document.close()l束啊?

  9、终极应?-弹出的窗口之Cookie控制
  回想一下,上面的弹出窗口虽焉Q但是有一点小毛病(沉浸在喜悦之中,一定没有发现吧Q?比如你将上面的脚本放在一个需要频J经q的面?例如首页)Q那么每ơ刷新这个页面,H口都会弹出一ơ,是不是非常烦人?:-(
  有解决的办法吗?当然有!我们使用cookie来控制一下就可以了。首先,如下代码加入主面HTML?lt; HEAD>区:
  < script>
  function openwin(){
  window.open("page.html","","width=200,height=200")
  }
  function get_cookie(Name) {
  var search = Name + "=" var returnvalue = "";
  if (document.cookie.length > 0) {
  offset = document.cookie.indexOf(search)
  if (offset != -1) {
  offset += search.length
  end = document.cookie.indexOf(";", offset);
  if (end == -1)
  end = document.cookie.length;
  returnvalue=unescape(document.cookie.substring(offset, end))
  }
  }
  return returnvalue;
  }
  function loadpopup(){
  if (get_cookie("popped")=="){
  openwin()
  document.cookie="popped=yes"
  }
  }
  < /script>
  然后Q用< body onload="loadpopup()">Q注意不是openwin而是loadpop啊!Q替换主面中原有的< BODY>q一句即可。你可以试着h一下这个页面或重新q入该页面,H口再也不会弹出了。真正的Pop-Only-OnceQ?br />   写到q里弹出H口的制作和应用技巧基本上是完成了,Z累坏了,一口气说了q么多,希望Ҏ在制作网늚朋友有所帮助俺就非常ƣ慰了?
  需要注意的是,JS脚本中的的大写最好前后保持一致?nbsp;



feingto 2007-12-29 14:24 发表评论
]]>
վ֩ģ壺 ˾þóۺӰԺ| av| 91ƵƷȫѹۿ| AVպAV| 1000Ƶ| һ| ҹδʮվ2| ĻƵһ| 㽶97Ƶ| ۺϼС˵| պ޹ۺϾþþ| 2021ƷƷѹۿ| ؼëƬȫѲ| ഺɫУ԰С˵| ޾Ʒ߹ۿ̬ͼ| Ļ4| WWWƵ| þþƷAVδʮ| þþƷav鶹| ߹ۿëƬ| þҹƵ| Ƶ߹ۿѲ | ëƬƵ| avѸ߳ˮ| ˳ӰԺ| vaþþþúݺ | ޹һ| ޾Ʒþþ| ѿƬִֻ| 69ƵƬ| þóѲ| ĻӰӾþþѹۿ| ŷ ͼƬۺ| ޸߹ۿ| ޾Ʒר| yw855.cƵ| ˻18Ƶ| vƬ߹ۿƵվ| ĻѾþ| ƷѾþþþþþþ| ޹Ʒþ|