免费精品视频一区二区三区,亚洲黄色成人网,日韩—二三区免费观看av

prototype.js之ajax.request学习�W�记(一)

Jkallen — Fri, 21 Jul 2006 08:47:00 GMT

摘要: �q�二天用prototype.js中的ajax.request做了些东�?闲时看了下源�?体会如下�Q? 　　在用AJAX部分前，有如下一些函数得了解一下：　　Class变量 var Class = { create: function... 阅读全文

Jkallen 2006-07-21 16:47 发表评论

DWR让AJAX如此��?�?

Jkallen — Tue, 11 Jul 2006 02:53:00 GMT

作�?Cloves Carneiro; simmone
原文地址: http://www.javaworld.com/javaworld/jw-06-2005/jw-0620-dwr.html
中文地址: http://www.matrix.org.cn/resource/article/43/43926_DWR_AJAX.html
关键词： DWR AJAX

概述

�q�篇文章阐述了��用开源项目DWR(直接Web�q�程控制)和AJAX(异步JavaScript和XML)的概忉|��提高Web应用的可用性。作者一步步来展�C�DWR如何使得AJAX的应用既��单又快捷。（1600�?2005�q?�?0日）

AJAX�Q�或者说是异步JavaScript和XML�Q�描�q�C��一�U��用�؜合了HTML(或XHTML)和层叠样式表作�ؓ表达信息,来创��Z��互式的Web应用的开发技�?文档对象模型�Q�DOM�Q�，JavaScript,动态地昄��和与表达信息�q�行交互;�q�且�Q�XMLHttpRequest对象与Web服务器异步地交换和处理数据�?br />
因特�|�上许多例子展示了在一个HTML文�g内部使用XMLHttpRequest与服务器端进行交互的必要的步骤。当手工地编写和�l�护XMLHttpRequest代码�Ӟ��开发者必��d��理许多潜在的问题�Q�特别是�c�M��于跨��览器的DOM实现的兼�Ҏ��这��L��问题。这��会��D��在编码和调试Javascript代码上面��p��C��清的旉��Q�这昄��对开发者来说很不友好�?br />
DWR(直接Web�q�程控制)��目是在Apache许可下的一个开源的解决�Ҏ��Q�它供给那些惌��以一�U�简单的方式使用AJAX和XMLHttpRequest的开发者。它��h��一套Javascript功能集，它们把从HTML��面调用应用服务器上的Java对象的方法简化了。它操控不同�c�d��的参敎ͼ��q�同时保持了HTML代码的可��L��?br />
DWR不是对一个设计的插入�Q�也不强�q�对象��用�Q何种�cȝ��l�承�l�构。它和servlet框架内的应用配合的很好。对�~�少DHTML�~�程�l�验的开发者来��_��DWR也提供了一个JavaScript库包含了�l�常使用的DHTML��d��Q�如�l�装表，用item填充select下拉框，改变HTML元素的内容，�?lt;div>�?lt;span>
DWR�|�站是详��的�q�且有大量的文档�Q�这也是�q�篇文章的基��。一些例子用来展�C�DWR如何使用和用它的库可以完成什么样的工作�?br />
�q�篇文章让读者看��C��一个��用了DWR的Web应用是如何一步步建立的。我会展�C�创��个简单的�C�Z��应用的必要的�l�节�Q�这个应用是可下载的�q�且可以在你的环境中布��v来看看DWR如何工作�?br />注意�Q�找到有关AJAX的信息�ƈ不困�?�|�页上有几篇文章和博客的条目�늛�了这个主题，每一个都试图指出和评��个概�늚�不同的方面。在资源部分�Q�你会找��C��些有��的指向�C�Z��和文章的链接�Q�来学习AJAX的更多的内容�?br />
�C�Z��应用
�q�篇文章使用的示例应用模拟了多��u多的一个公寓出�U�搜索引擎。用户可以在搜烦前选择一�l�搜索标准。�ؓ了提高交互性，AJAX中以下两�U�情况下使用�Q?br />·应用通告用户配合他的选择会返回多��搜索结果。这个数字是实时更新�?使用AJAX-当用户选择的卧室和��室的数量，或者�h��D��围变化时。当�W�合标准的搜索结果没有或太多�Ӟ��用户��没有必要点��L��索按�U��?br />·数据库查询�ƈ取回�l�果是由AJAX完成的。当用户按下昄��l�果按钮�Ӟ��数据库执行搜索。这��P��应用看�v来更具响应了�Q�而整个页面不需要重载来昄��l�果�?br />
数据�?/span>
我们使用的数据库是HSQL�Q�它是一�U�占用资源很��的Java SQL数据库引擎，可以不需要安装和配置的与Web应用捆绑在一赗��一个SQL文�g被用来在Web应用的上下文启动时创��Z��个内存中的表�q�添加一些记录�?br />
Java�c?/span>
应用包含了两个主要的�c�d��Apartment和ApartmentDAO。Apartment.java�c�L��一个有着属性和getter/setter�Ҏ��的简单的Java�c�R��ApartmentDAO.java是数据访问类�Q�用来查询数据库�q�基于用��L��搜烦标准来返回信息。ApartmentDAO�cȝ��实现的直接了当的;它直接��用了Java数据库联接调用来得到公寓的��L��和符合用戯��求的可用公寓的列表�?br />
DWR配置和��?/span>
讄��DWR的��用是��单的�Q�将DWR的jar文�g拷入Web应用的WEB-INF/lib目录中，在web.xml中增加一个servlet声明�Q��ƈ创徏DWR的配�|�文件。DWR的分发中需要��用一个单独的jar文�g。你必须��DWR servlet加到应用的WEB-INF/web.xml中布�|�描�q�段中去�?br />

				    
        dwr-invoker
        DWR Servlet
        Direct Web Remoter Servlet
        uk.ltd.getahead.dwr.DWRServlet
        
            debug
            true
        
    

    
        dwr-invoker
        /dwr/*

一个可选的步骤是设�|�DWR��试模式—象上面的例子那样—在servlet描述�D�中��debug参数设�ؓtrue。当DWR在调试模式时�Q�你可以从HTMl�|�页中看到所有的可访问的Java对象。包含了可用对象列表的网��会出现�?WEBAPP/dwr�q�个url上，它显�C�Z��对象的公共方法。所列方法可以从��面中调用，允许你，�W�一�ơ，�q�行服务器上的对象的�Ҏ��。下图显�C�Z��调试��늚�样子:

调试��?br />
现在你必��让DWR知道通过XMLHttpRequest对象�Q�什么对象将会接收请求。这个�Q务由叫做dwr.xml的配�|�文件来完成。在配置文�g中，定义了DWR允许你从�|�页中调用的对象。从设计上讲�Q�DWR允许讉K��所有公布类的公共方法，但在我们的例子中�Q�我们只允许讉K��几个�Ҏ��。下面是我们�C�Z��的配�|�文�?

上面的文件实��C��我们例子中的两个目标。首先，标记告诉DWR��dwr.sample.Apartment对象的类型�{换�ؓ联合数组�Q�因为，��Z��安全的原因，DWR默认的不会�{换普通bean。第二，标记让DWR暴露出dwr.sample.ApartmentDAO�cȝ��JavaScript调用;我们在页面中使用JavaScript文�g被javascript属性定义。我们必��L��?lt;include>标记�Q�它指明了dwr.sample.ApartmentDAO�cȝ��哪些�Ҏ��可用�?br />
HTML/JSP代码
配置完成后，你就可以启动你的Web应用了，�q�时DWR会�ؓ从你的HTML或Java服务器端��面(JSP)上调用所需�Ҏ��作好准备�Q��ƈ不需要你创徏JavaScript文�g。在search.jsp文�g中，我们必须增加由DWR提供的JavaScript接口�Q�还有DWR引擎�Q�加入以下三行到我们的代码中�Q?br />

我们注意到当用户改变搜烦标准�Ӟ��q�是AJAX在示例程序中的首�ơ应�?正如他所看到的，当标准改变时�Q�可用的公寓数量被更��C��。我创徏了两个JavaScript函数�Q�当某一个选择下拉框中的值变化时被调用。ApartmentDAO.countApartments()函数是最重要的部分。最有趣的是�W�一个参�? loadTotal()函数�Q�它指明了当接收到服务端的返回时DWR��会调用的JavaScript�Ҏ��。loadTotal于是被调用来在HTML��面�?lt;div>中显�C�结果。下面是在这个交互场景中所使用到的JavaScript函数:

				function updateTotal() {
    $("resultTable").style.display = 'none';
    var bedrooms = document.getElementById("bedrooms").value;
    var bathrooms = document.getElementById("bathrooms").value;
    var price = document.getElementById("price").value;
    ApartmentDAO.countApartments(loadTotal, bedrooms, bathrooms, price);
}

function loadTotal(data) {
    document.getElementById("totalRecords").innerHTML = data;
}

很明显，用户想看到符合他的搜索条件的公寓列表。那么，当用户对他的搜烦标准感到满意�Q��ƈ且��L��也是有效的话�Q�他会按下显�C�结果的按纽�Q�这��会调用updateResults() JavaScript�Ҏ��Q?br />

				function updateResults() {
    
    DWRUtil.removeAllRows("apartmentsbody");
    var bedrooms = document.getElementById("bedrooms").value;
    var bathrooms = document.getElementById("bathrooms").value;
    var price = document.getElementById("price").value;
    ApartmentDAO.findApartments(fillTable, bedrooms, bathrooms, price);
    $("resultTable").style.display = '';
}

function fillTable(apartment) {
    DWRUtil.addRows("apartmentsbody", apartment, [ getId, getAddress, getBedrooms, getBathrooms, getPrice ]);
}

updateResults()�Ҏ��清空了存放搜索返回结果的表域�Q�从用户界面上获取所需参数�Q��ƈ且将�q�些参数传给DWR创徏的ApartmentDAO对象。然后数据库查询��被执行�Q�fillTable()��会被调用，它解析了DWR�q�回的对�?apartment)�Q�然后将其显�C�到��面�?apartmentsbody)�?br />
安全因素
��Z��保持�C�Z��的简要，ApartmentDAO�c�d��可能的保持简单，但这��L��一个类通常有一�l�设�|�方法来操作数据�Q�如insert(), update()和delete()。DWR暴露了所有公共方法给所有的HTML��面调用。出于安全的原因�Q�像�q�样暴露你的数据讉K��层是不明智的。开发者可以创��Z��个门面来集中所有JavaScript函数与底层业务组件之间的通信�Q�这样就限制了过多暴露的功能�?br />
�l�论
�q�篇文章仅仅让你在你的项目中使用由DWR支持的AJAX开了个头。DWR让你集中注意力在如何提高你的应用的交互模型上面，消除了编写和调试JavaScript代码的负担。��用AJAX最有趣的挑战是定义在哪里和如何提高可用性。DWR负责了操作Web��面与你的Java对象之间的通信�Q�这样就帮助你完全集中注意力在如何让你的应用的用��L��面更加友好，
我想感谢Mircea Oancea和Marcos Pereira,他们阅读了这��文章�ƈ�l�予了非常有价值的�q�匮�?br />
资源
·javaworld.com: javaworld.com
·Matrix-Java开发者社�? http://www.matrix.org.cn/
·onjava.com: onjava.com
·下蝲�C�Z��E�序的全部源�? http://www.javaworld.com/javaworld/jw-06-2005/dwr/jw-0620-dwr.war
·DWR: http://www.getahead.ltd.uk/dwr/index.html
·HSQL:http://hsqldb.sourceforge.net/
·AJAX的定�?http://en.wikipedia.org/wiki/AJAX
· “AJAX:通向Web应用的新途径": Jesse James Garrett (Adaptive Path, 2005.2): http://www.adaptivepath.com/publications/essays/archives/000385.php
· “非常动态的Web界面�?Drew McLellan (xml.com, 2005.2): http://www.xml.com/pub/a/2005/02/09/xml-http-request.html
·XMLHttpRequest & AJAX 工作范例: http://www.fiftyfoureleven.com/resources/programming/xmlhttprequest/examples
· “可用的XMLHttpRequest实践�?Thomas Baekdal (Baekdal.com, 2005.3): http://www.baekdal.com/articles/Usability/usable-XMLHttpRequest/
·"XMLHttpRequest使用导引" Thomas Baekdal (Baekdal.com, 2005.2):http://www.baekdal.com/articles/Usability/XMLHttpRequest-guidelines/
·AJAX实质:http://www.ajaxmatters.com/

(看完后个人感觉：有了DWR��JAVA开发而言�Q�完全可以与AJAX�Ҏ��啦，省了在JS上对XMLHTTP以及对DOM的处理，不可以避免地在后台对应的IO处理�Q�然后就DWR来说�Q�它增加了对XML中对应的配置--在开源框架中��g��一直不曑ց�止过。还有对一些DWR自有用法如DWRUtil.addRows得参考其相关文��---当然�q�样的功能我们自�׃��可以用JS来解冻I��q�且它显然很实用。add by jkallen)

Jkallen 2006-07-11 10:53 发表评论

Ajax---与服务器通信�Q�请求参��C��为XML发送）

Jkallen — Wed, 29 Mar 2006 07:04:00 GMT

摘要: 首先看下看下相对��单些�?-向服务器发送一个包含有�?值对的简单查询串在这�U�情况下XHP卛_��以用GET也可以用POST。GET function doRequestUsingGET() { createXMLHttpRequest(); ... 阅读全文

Jkallen 2006-03-29 15:04 发表评论

Jkallen — Tue, 28 Mar 2006 14:28:00 GMT

好久没有做过关于AJAX的东西了�Q��^时做的也无非��是通过XHP要么用GET�Q�请求部分是�q�加到URL中的�q�且��览器对光��度有会有限制�Q�方法要么通过POST�Q�请求参数内容可以放到请求体中�ƈ且无量的限制�Q�方法。传递的无非是些参数��|��以名=值的方式出现as : name=jkallen�Q�要么就是DOM对象了。再发到到服务端后做些处理再�q�回到客��L��昄��对应�l�果�?br />
今天看到了一个好东东�Q�就是通过JSON(JavaScript Object Notation)向服务器发送数据。它是一�U�轻量��的数据交换格式，使用了类��g��C语言家族的习惯�?br />

JSON��h��以下�q�些形式�Q?/font>

a : 对象是一个无序的“‘名�U?值’对”集合。一个对象以“{”（左括��P��开始，“}”（��x��P��l�束。每个“名�U�”后跟一个�?”（冒号�Q�；“‘名�U?值�?对”之间��用�?”（逗号�Q�分隔�?

b: 数组是��|��value�Q�的有序集合。一个数�l�以“[”（左中括号�Q�开始，“]”（右中括号�Q�结束。��g��间��用�?”（逗号�Q�分隔�?

c: ��|��value�Q�可以是双引��h��h��的字�W�串�Q?i>string�Q�、数�?number)�?ture、false�?null、对象（object�Q�或者数�l�（array�Q�。这些结构可以嵌套�?

d: 字符�Ԍ��string�Q�是由双引号包围的�Q意数量Unicode字符的集合，使用反斜�U��{义。一个字�W�（character�Q�即一个单独的字符�Ԍ��character string�Q��?/font>

不多说了�Q�关于JSON其实�?/font> www.json.org 上讲得太好了�Q�上面不但有每个JAVA的源文�g�Q�而且每个文�g都有与之对应的JAVA DOC�Q�还有不��实例！

我就选了json in java and json in javascript 二个链接 ,从这二个地方可以下到JSON的javascript包和Java包�?br />
Javascript 包的应用如下�Q?br />
首先创徏一个符合json的对象，�q��过XHP发送到sever

< script type = " text/javascript " src = " json.js " > script >
< script type = " text/javascript " >

var xmlHttp;

function createXMLHttpRequest() {
     if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject( " Microsoft.XMLHTTP " );
    }
     else if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
}

function doJSON() {
     var car = getCarObject();

     // Use the JSON JavaScript library to stringify the Car object
     var carAsJSON = JSON.stringify(car);
    alert( " Car object as JSON:\n " + carAsJSON);

     var url = " JSONExample?timeStamp= " + new Date().getTime();

    createXMLHttpRequest();
    xmlHttp.open( " POST " , url, true );
    xmlHttp.onreadystatechange = handleStateChange;
    xmlHttp.setRequestHeader( " Content-Type " , " application/x-www-form-urlencoded " );
    xmlHttp.send(carAsJSON);
}

function handleStateChange() {
     if (xmlHttp.readyState == 4 ) {
         if (xmlHttp.status == 200 ) {
            parseResults();
        }
    }
}

function parseResults() {
     var responseDiv = document.getElementById( " serverResponse " );
     if (responseDiv.hasChildNodes()) {
        responseDiv.removeChild(responseDiv.childNodes[ 0 ]);
    }

     var responseText = document.createTextNode(xmlHttp.responseText);
    responseDiv.appendChild(responseText);
}

function getCarObject() {
     return new Car( " Dodge " , " Coronet R/T " , 1968 , " yellow " );
}

function Car(make, model, year, color) {
     this .make = make;
     this .model = model;
     this .year = year;
     this .color = color;
}

script >

那个json.js��是我们下下来的包啦�Q?br />
我们再看看在server端的处理

package ajaxbook.chap3;

import java.io. * ;
import java.net. * ;
import java.text.ParseException;
import javax.servlet. * ;
import javax.servlet.http. * ;
import org.json.JSONObject;

public class JSONExample extends HttpServlet {

     protected void doPost(HttpServletRequest request, HttpServletResponse response)
     throws ServletException, IOException {
        String json = readJSONStringFromRequestBody(request);

         // Use the JSON-Java binding library to create a JSON object in Java
        JSONObject jsonObject = null ;
         try {
            jsonObject = new JSONObject(json);
        }
         catch (ParseException pe) {
            System.out.println( " ParseException: " + pe.toString());
        }

        String responseText = " You have a " + jsonObject.getInt( " year " ) + " "
             + jsonObject.getString( " make " ) + " " + jsonObject.getString( " model " )
             + " " + " that is " + jsonObject.getString( " color " ) + " in color. " ;

        response.setContentType( " text/xml " );
        response.getWriter().print(responseText);
    }

     private String readJSONStringFromRequestBody(HttpServletRequest request) {
        StringBuffer json = new StringBuffer();
        String line = null ;
         try {
            BufferedReader reader = request.getReader();
             while ((line = reader.readLine()) != null ) {
                json.append(line);
            }
        }
         catch (Exception e) {
            System.out.println( " Error reading JSON string: " + e.toString());
        }
         return json.toString();
    }
}

那个不�v眼的org.json.JSONObject��是我们从JSON.ORG上下下来的JAVA包！它上面也有JSONObject的JAVA DOC所以不用担心不知道用啦�Q?br />
OK到此全部搞定啦！

可以看到�q�样比我们��^旉��过XHP传递一个DOM对象�Q�通过�q�接串来创徏XML�Ԍ��要方便些�Q�再说通过�q�接串来处理也不是生成XML数据�l�构的健壮技术！

参考资�?/font>�Q?/font> foundations-of-ajax
www.json.org

相关链接: Ajax---与服务器通信�Q�请求参��C��为XML发送）

Jkallen 2006-03-28 22:28 发表评论

打造完��的JS树�Ş菜单

Jkallen — Tue, 28 Mar 2006 10:15:00 GMT

摘要: 其实�|�上现在用JS来实��C��个树形的代码多得不成样子�?不过偶觉得这个还��可以的(臛_��比我�W�一�ơ写的那个强多了o_o)我在WEB中JS初始化如�? < script language = " javascript " > Show_... 阅读全文

Jkallen 2006-03-28 18:15 发表评论

格式化JSP��面

Jkallen — Wed, 15 Mar 2006 04:50:00 GMT

JSP��面里面的内容往往是动态显�C?当然也一般是从DB中按需取出来的�?
在显�C��E�也�怼��到�q�样的问�?

我们通过后台操作��一些文�?通知什么的)传到DB�?其中隑օ�会分�D?分行什么的.可是我们从DB中取出来直接在JSP��面昄��时出来的却是从头到尾的一片文�?!!

解决�Ҏ��:
首先应将在DB中的相关昄��文字取出来的时候进行一个�{�?比如说把里面的回�?换行,�I�格什么的转换成HTML能识别的标记.也许以下代码正是我们需要的:

public class CheckData extends Object {

    /** *//** *//** *//**
     * CheckData 构造器
     *
     * @param
     * @return

     */

    public CheckData() {}

    /** *//** *//** *//**
     * 字符串替换，��?nbsp;source 中的 oldString 全部换成 newString
     *
     * @param source 源字�W�串
     * @param oldString 老的字符�?BR>     * @param newString 新的字符�?BR>     * @return 替换后的字符�?BR>     */
    public static String Replace(String source, String oldString, String newString) {
        StringBuffer output = new StringBuffer();

        int lengthOfSource = source.length();   // 源字�W�串长度
        int lengthOfOld = oldString.length();   // 老字�W�串长度

        int posStart = 0;   // 开始搜索位�|?/SPAN>
        int pos;            // 搜烦到老字�W�串的位�|?/SPAN>

        while ((pos = source.indexOf(oldString, posStart)) >= 0) {
            output.append(source.substring(posStart, pos));

            output.append(newString);
            posStart = pos + lengthOfOld;
        }

        if (posStart < lengthOfSource) {
            output.append(source.substring(posStart));
        }

        return output.toString();
    }

    /** *//**//*
    public static String ReplaceIgnoreCase(String source, String oldString, String newString) {
    }
    */

    /** *//** *//** *//**
     * ��字�W�串格式化成 HTML 代码输出
     * 只�{换特�D�字�W�，适合�?nbsp;HTML 中的表单区域
     *
     * @param str 要格式化的字�W�串
     * @return 格式化后的字�W�串
     */
    public static String toHtmlInput(String str) {
        if (str == null)    return null;

        String html = new String(str);

        html = Replace(html, "&", "&");
        html = Replace(html, "<", "<");
        html = Replace(html, ">", ">");

        return html;
    }

    /** *//** *//** *//**
     * ��字�W�串格式化成 HTML 代码输出
     * 除普通特�D�字�W�外�Q�还对空根{��制表符和换行进行�{换，
     * 以将内容格式化输出，
     * 适合�?nbsp;HTML 中的昄��输出
     *
     * @param str 要格式化的字�W�串
     * @return 格式化后的字�W�串
     */
    public static String toHtml(String str) {
        if (str == null)    return null;

        String html = new String(str);

        html = toHtmlInput(html);
        html = Replace(html, "\r\n", "\n");
        html = Replace(html, "\n", "
\n");
        html = Replace(html, "\t", "    ");
        html = Replace(html, "  ", "  ");

        return html;
    }

}

好啦,现在你可以直接通过�c�调用相应的�Ҏ��(比如说toHtml)�?��成了HTML能识别的格式�?如你在DB中的内容可能如下:

"lilin and you do it "
也许转换后成�?BR>"lilin and you do it
"

接下来也许我们会很自然地惛_��用JS(innerTHML,document.write()�{�等来处�?来将其输出到JSP�?然而结果却往往不是我们惌��?原因是你在DB中的数据不符合JS的语�?因�ؓ在JS中要求所有的输出语句均在同一行中,否则��׃��出现"未结束的字符串常�?的错�?而我们�{换后的仅仅是把DB中数据用HTML标识�W�来替代,比如说若有一行空�?那么很可能对应的��是一�?
"�W�号,但是�q�个�W�号依然会占一�?..(大概是这个意�?

我在JSP��面�?直接��它们out出来�?想一下servlet是怎么直接昄��布面内容的^_^,虽然我一向对servlet�q�样的行为比较反�?!不管我们转换后的字符串中有多��行,全部把它攑ֈ�out中就可以�?惟一的缺��h��又要在JSP中多一�?<%=%>"�W�号.

不知道各位有什么别的好�Ҏ��没有?

Jkallen 2006-03-15 12:50 发表评论

妙用javascript

Jkallen — Mon, 06 Mar 2006 09:05:00 GMT

摘要: 以下是本人在代码中常用到的一些JS脚本,虽然是一些简单而又短小的function却是帮了我不��的忙呢!希望对大家有些用,有了好的再脓上来 ^_^1�Q�在一带到复杂的FRAME��面中OPEN一个窗体来�Q�当然不用什么parent.parent啦） function checkuser(name) ... 阅读全文

Jkallen 2006-03-06 17:05 发表评论