XML and JSP

zhaozj2021-02-17  58

XML and JSP this article from http://www.javaworld.com/javaworld/jw-03-2000/jw-0331-ssj-jspxml.htm

If you visit this page, you can also connect to Resource, Init.JSP, and other source code files.

Consequence

}

Two Great Tastes That Taste Great Together

Author: Alex Chaffee

Overview:

XML and JSP are the hottest things in these days. This article describes how to combine these two

Techniques to build a dynamic website. You can also look at DOM, XPath, XSL,

And sample code for other Java-XML technology.

We have assumed you to know JavaServer Pages (JSP) and Extensible

Markup Language (XML). But maybe you have used them to use them.

confuse.

JSP applications are easy, you can use it to design web pages, make it look like and HTML

kind. The only difference is that JSP is dynamically executed. For example, they can handle forms FORM

And read and write the database.

The description of the application of XML is more difficult. It seems that all products support it, everyone is also

It seems to use it in a variety of different purposes.

In this article, you can see how to use an XML in a fairly advanced way to design one

System. Many sites have huge amounts of data to collect and use a very standard or unbelievable way.

To display them. I will design a system that uses XML files on the web server.

Store and use JSP to display data.

XML VS relational database

"Wait!" You may ask, "Do you store data with XML files? Why don't you use a database?"

This question is very good. My answer is that the use of many purposes is too

Waste. To use a database, you must install and support a separate server

Treatment process (a Separate Server Process), which often requires installation and support

Administrator. You must learn SQL, write queries with SQL, then convert data,

Return. And if you store data with XML file, you will reduce the negative of additional servers.

Load. Also, you have also found a simple way to edit data. You only need to use text

Compare, without having to use complex database tools. XML file is easy to back up, and friends

Enjoy, or download to your client. Similarly, you can easily upload new in FTP

Data to your site.

XML has a more abstract advantage that as a layer-based format is better than the relationship.

It can design data structures in a very direct way to meet your needs. You don't need

To use an entity-relational editor, you don't need to make your chart (Schema) standard

. If you have an element (Element) contains another element, you can

In the format, it indicates it without the need to use the association.

Note that in many applications, it is not sufficient to rely on the file system. If there are a lot of updates,

The file system is destroyed by simultaneous writing. Database usually supports transaction processing,

It is possible to cope with the requested request and not damage. For complex query statistics, there must be repeated

, Timely update, this time the database performance is excellent. Of course, the relational database is also

There are many advantages, including rich query languages, chart tools, scalability, access

Control, etc.

(Note: You can use simple file lock to provide a transaction server, you still

You can perform an XML INDEX-AND-Search tool in Java, but this is already

Another theme of an article. )

In the following case, as most small, based on the site-based site, most data access you may involve is read, not written, data

However, it may be large, but it is relatively unusually updated, you don't need to do it.

Complex query, even if you need to do it, you will use a separate query tool, then

The advantages of the cooked RDBMS disappeared, and the advantages of object-oriented data models can be

By manifestation.

Finally, provide a querier shell for your database to perform SQL query and turn them

It is also possible to enter XML Stream is also possible.

So you can choose one of these two ways. XML is turning into a very robust, easy

Programming tools, as a front-end tool for a mature database for storage and queries.

(Oracle's XSQL servlet is a good example of this technology.)

Application: an online album

Everyone likes to take pictures! They like to show their own, relatives, friends, vacation

Time photos, and web is a good place they show. - Even relatives outside a thousand miles

You can see it. I will focus on defining a separate Picture object. (This application

The source code can be obtained in Resources). This object describes a photo required to indicate a photo.

Field: Title, Date, an optional title, and a point for the source

to.

An image requires some of its own fields: source file (GIF / JPEG) positioning, wide

Degree and height pixels (to assist in building tags. Here you can see a very simple

Advantages, that is, when using the file system instead of the database, you can save the graphic file

Put in the same directory as the data file.

Finally, let us use an element to expand the picture record, which defines a set of thumbnails

Figure (thumbnail) is used for content sheets or elsewhere. Here I used and previously the same

Defined picture content.

A picture of the XML representation can be like this:

alex on the beach </ title></p> <p><Date> 1999-08-08 </ date></p> <p><Caption> Trying in Vain To Get a Tan </ CAPTION></p> <p><iMage></p> <p><src> alex-beach.jpg </ src></p> <p><width> 340 </ width></p> <p><HEIGHT> 200 </ height></p> <p></ iMAGE></p> <p><thumbnails></p> <p><iMage></p> <p><src> alex-beach-sm.jpg </ src></p> <p><width> 72 </ width></p> <p><HEIGHT> 72 </ height></p> <p></ iMAGE></p> <p><iMage></p> <p><src> alex-beach-med.jpg </ src></p> <p><width> 150 </ width></p> <p><HEIGHT> 99 </ height></p> <p></ iMAGE></p> <p></ thumbnails></p> <p></ Picture></p> <p>Note that by using XML, you put all the information on a separate picture to a separate</p> <p>In the file, not to disperse it into 3-4 tables.</p> <p>We will call this as .pix file</p> <p>- So your file system will be like this:</p> <p>Summer99 / alex-beach.pix</p> <p>Summer99 / alex-beach.jpg</p> <p>Summer99 / alex-beach-sm.jpgsummer99 / alex-beach-med.jpg</p> <p>SUMMER99 / ALEX-SNORKELING.PIX</p> <p>ETC.</p> <p>Technical articles</p> <p>As the saying goes, how to peel off the skin of the cat. Similarly, put XML data into JSP</p> <p>More than one way is also known. Here is some methods, (in fact, many other workers)</p> <p>It can also be done. )</p> <p>DOM: You can use classes to call the DOM interface (interface) to XML</p> <p>The file is analyzed.</p> <p>XMLENTRYLIST: You can use my code to load XML to Name-Value</p> <p>PAIRS 'java.util.list.</p> <p>XPath: You can use an XPath processor (such as RESIN) through the path name in XML</p> <p>Locate elements in the file.</p> <p>XSL: You can use some XSL processor to convert XML to HTML.</p> <p>COCOON: You can use Cocoon Framework for open source</p> <p>Run your own bean: You can write a housing class (Wrapper Class), use a</p> <p>Other techniques to load data into a word-defined JavaBean.</p> <p>Please note that these technologies will be in the same way as you have learned from another source.</p> <p>Excellent, such as a client or an application server.</p> <p>JavaServer Pages</p> <p>The JSP specification has a lot of substitutes, and the performance of different JSP products is not the same, between different versions.</p> <p>There is also a difference. I chose Tomcat, which is based on the following reasons:</p> <p>It supports most of the latest JSP / Servlet specifications</p> <p>It is recognized by Sun and Apache</p> <p>You can run it independently without need to configure a web server.</p> <p>It is open source</p> <p>You can choose any JSP engine you like, but you must configure it yourself, it must be at least</p> <p>JSP 1.0 specification. There are many differences between 0.91 and 1.0. Jswdk</p> <p>(Java Server Web Development Kit) may just be suitable for requirements.</p> <p>JSP structure</p> <p>When you create a JSP website (WebApp), I like to import public functions, import, constants,</p> <p>Variable declarations are placed in a separate file init.jsp. Then</p> <p><% @ include file = "init.jsp"%> Load to each file.</p> <p><% @ include%> Just like the C language #include, including Include makes it when compiling</p> <p>Text is added as a part to compile and compile together, relatively, <JSP: include></p> <p>The flag is to compile the files independently, then embed a pair in the file.</p> <p>Its call.</p> <p>Find files</p> <p>When JSP starts, the first thing to initialize is to find the XML file you want. How is it?</p> <p>What one of you are looking for in numerous files? It comes from a parameter, user</p> <p>Add parameters in the URL calling JSP: Picture.jsp? File = summer99 / alex-beach.pix</p> <p>(Or pass the file parameters via HTML form).</p> <p>However, when JSP accepts this parameter, you still have half work, because</p> <p>Where is the root directory of the file system. For example, in a UNIX system, the actual file may</p> <p>In this path:</p> <p>/Home/alex/public_html/pictures/summer99/alex-beach.pix.</p> <p>There is no current path concept when the JSP file is executed. So you have given Java.IO package</p> <p>A absolute path.</p> <p>The Servlet API can provide a method to route a URL from the current JSP</p> <p>Or the path to the servlet is converted to an absolute file system path. The method is: servletContext.getRealPath (String).</p> <p>Each JSP has a servletContext object called Application. So</p> <p>The code can be:</p> <p>String picturefile =</p> <p>Application.getRealPath ("/" Request.GetParameter ("file"));</p> <p>or</p> <p>String picturefile =</p> <p>GetServletContext (). getRealPath ("/" Request.GetParameter ("file"));</p> <p>It can also work in servlet. (You must add / because this method needs to pass Request.getPathInfo</p> <p>()the result of. )</p> <p>There is an important tip here: Whenever you access local resources, you must checked the legality of the input data very carefully.</p> <p>.</p> <p>Hackers or careless users, may send fake or wrong data to destroy your station</p> <p>point. For example, please think about what the following results occur:</p> <p>If you enter file = .. / .. / .. / .. / etc / passwd. This way users read back to you</p> <p>Server's Password file!</p> <p>DOM (Document Object Model)</p> <p>DOM represents document object model Document Object Model. It browsing XML documentation</p> <p>A standard API developed by World Wide Web Consortium (W3C). interface</p> <p>In the Org.W3c.DOM package, the documentation will see the W3C site.</p> <p>There are many available DOM analyzer tools. I chose the IBM XML4J. But you can use</p> <p>Any other DOM analyzer. This is because the DOM is a set of interfaces, not classes - all</p> <p>The DOM Analyzer (PARSER) must return objects that deal with these interfaces.</p> <p>Unfortunately, although it is very standard, DOM still has two major flaws:</p> <p>1 API is also object-oriented, is still quite cumbersome.</p> <p>Dom Parser does not have a standard API, so when each analyzer returns one</p> <p>Org.w3c.dom object, document object - analyzer initialization and file itself loaded</p> <p>, Corresponding to different analyzers is typically always specific.</p> <p>This simple picture file that has been described above can be in a tree structure in a tree structure.</p> <p>Some objects are represented as follows:</p> <p>Document Node</p> <p>-> Element Node "Picture"</p> <p>-> Text node "/ n" (Whitespace)</p> <p>-> Element Node "Title"</p> <p>-> Text Node "alex on the beach"</p> <p>-> Element Node "Date"</p> <p>-> ... ETC.</p> <p>In order to get "Alex On The Beach", you have to do some ways to call, travel DOM</p> <p>Tree, and analyzer may choose to disperse "Whitespace" text Nodes</p> <p>According to, you have to use cycles and series, etc. (you can call Normalize ()</p> <p>Correct this issue. ) The analyzer may also contain separate XML entities (such as &),</p> <p>CDATA NODES or other entity nodes (such as <b> Big <b> will become at least three</p> <p>Node. There is no way to express it in the DOM "Get Me TEXT VALUE OF"</p> <p>In short, there is a cumbersome game in the DOM. (See this article to replace the DOM chapter in this article.)</p> <p>2 From a higher place, the problem of the DOM is that the XML object cannot be directly like the Java object.</p> <p>They need to be obtained by a DOM API.</p> <p>You can refer to my summary of the Java-XML Data Binding technology discussion,</p> <p>It also uses this method of directly using Java to access XML data.</p> <p>I wrote a small tool class called Domutils, including static methods to perform public</p> <p>DOM task. For example, to get the text of the Tostle child elements of the root (picture) element</p> <p>Rong, you can write the following code:</p> <p>Document Doc = Domutils.xml4jparse (PictureFile);</p> <p>Element noderoot = doc.getdocumentelement ();</p> <p>Node nodetitle = Domutils.getChild (Noderoot, "Title");</p> <p>String title = (nodetitle == null)? Null: Domutils.getTextValue (NodetiL)</p> <p>;</p> <p>Get the value of the iMage child element is also the same:</p> <p>Node nodeImage = Domutils.getchild (Noderoot, "Image");</p> <p>Node nodesrc = Domutils.getChild (NodeImage, "src");</p> <p>String SRC = Domutils.getTextValue (Nodesrc);</p> <p>and many more.</p> <p>Once you need to use the Java variable for each related element, you have to do it.</p> <p>The amount is embedded in the HTML tag:</p> <p><table bgcolor = "# ffffff" border = "0" Cellspacing = "0" Cellpadding = "5"></p> <p><tr></p> <p><TD align = "center" valign = "center"></p> <p><img src = "<% = src%>" width = "<% = width%>" height = "<% = height%>" border = "0" alt = "</p> <p><% = src%>> </ td></p> <p></ TR></p> <p></ TABLE></p> <p>MODEL / VIEW separation with JSP Bean</p> <p>All the Picture-Dom.jsp code above is very unhappy. Although you can join tens of thousands of people in JSP</p> <p>Java code, but this is not easy to use the JSP JavaBeans method.</p> <p>JavaBean stores a lot of Java code and calls in the JSP script.</p> <p>In order to make a model, put all Java code in JSP to start a project, so</p> <p>It is relatively simple. Once there is any new idea, you can go back to the unfolding code, then rewrite</p> <p>For some JavaBeans. Although the investment is high, the long-term repayment is better because you should</p> <p>Use more modeling. You can reuse beans in multiple pages without worrying about clippers.</p> <p>The bad consequences come.</p> <p>In our case, a typical JSP JavaBean is a string from the XML.</p> <p>You can define the Picture, Image, and Thumbnails classes to represent elements in the main XML file. These Beans have a constructors or setter method, it</p> <p>They brought a DOM Node or a file name from the expansion value. You can participate</p> <p>Take the PictureBeans package or Picture-Beans.jsp.</p> <p>Please pay attention to the following points when you look at the code:</p> <p>* I will define the interface independently, so you can choose to choose in the future.</p> <p>Instead, you can put the value in a list, or in the DOM itself, even</p> <p>In place in the database.</p> <p>* Bean is defined in a custom package --PictureBeans. All JSP beans must</p> <p>There is a need to be in a package. Most JSP engines cannot find classes from the default package.</p> <p>* In addition to the GET method, I also provided a SET method. You just read it, but in the future,</p> <p>You have to edit the image, so you have to plan the language to modify the functionality of the write attribute.</p> <p>* <% = picture.getcaption ()%> Replaced <% = capen%> because the value is stored</p> <p>In a bean instead of the local variable. However, if you need, you can put your local</p> <p>Variables are defined as</p> <p>String Caption = Picture.getCaption (); this is also allowed, this can make</p> <p>The code is easier to read and understand.</p> <p>* Zoom in zooming over thumbnails</p> <p>You may have noticed my first JSP output, Picture-Dom.html,</p> <p>The source picture files are used. We can modify the code slightly to make it display</p> <p>A thumbnail, I will store the thumbnail list in the XML data file.</p> <p>Let us define a parameter, ZOOM, which determines which thumbnail to display. point</p> <p>After hitting this thumbnail, look back to the full size picture; click the zoom in or zoom out button</p> <p>A thumbnail of the next / last thumbnail is selected.</p> <p>* Since the thumbnail object returns a java.util.list of an Image object, you have to find it.</p> <p>The correct thumbnail is not easy, if you use (image). Get (i).</p> <p>* To make zoom in and zoom out connections, you must establish a reference to the recursive of the same page, but</p> <p>Use different parameters. In order to do this, you have to use the request.getRequesturi () method. This</p> <p>Just provide you with the path of the servlet, there is no parameters, so you can make this more parameters you want.</p> <p><%</p> <p>IF (zoom <(thumbnails.size () -1)) {</p> <p>OUT.PRINT ("<a href = '" </p> <p>Request.GetRequesturi () </p> <p>"? File =" Request.getParameter ("file") </p> <p>"& zoom =" (ZOOM 1) </p> <p>"'");</p> <p>Out.print ("zoom in </a>");</p> <p>}</p> <p>%></p> <p>Here is an HTML screen copy.</p> <p>http://www.javaworld.com/jw-03-2000/jspxml/Picture-Dom.html</p> <p>Use JSP Bean</p> <p>The JSP specification defines the <JSP: Usebean> tag to automatically instantiate and use JavaBeans. Usebean tag can always</p> <p>Yes</p> <p>I have been embedded in Java code, and I do this here. Also because this reason</p> <p>People sometimes ask what is necessary to use UseBean and SetProperty tags. The advantage of this approach is:</p> <p>Mark syntax is beneficial to HTML designers work independently.</p> <p>UseBean has a scope parameter that automatically determines whether beans must be stored as a</p> <p>Local variables, a session variable or an Application property.</p> <p>If this variable is lasting (session or Application), usebean can</p> <p>Initialize it and remove the variable when it does exist.</p> <p>Long-term look tag is more portable or more in the future JSP specification.</p> <p>Change (for example, a hypothetical JSP engine stores variables in a database, or</p> <p>Share data across servers. )</p> <p>The corresponding UseBean statement in this application is:</p> <p><jsp: usebean id = "picture" scope = "request" class = "picturebeans.dompicture"></p> <p><%</p> <p>Document Doc = Domutils.xml4jparse (PictureFile);</p> <p>Element noderoot = doc.getdocumentelement ();</p> <p>Noderoot.normalize ();</p> <p>Picture.setnode (noderoot);</p> <p>%></p> <p></ jsp: usebean></p> <p>Or, if you define a setFile method in the Dombean:</p> <p><jsp: usebean id = "picture" scope = "request" class = "picturebeans.dompicture"></p> <p><jsp: setProperty name = "Picture" Property = "file" value = "<% = PictureFile%> /></p> <p></ jsp: usebean></p> <p>Use XMLENTRYLIST</p> <p>In order to overcome some of the shortcomings of the DOM APIS, I created a class called XmlenTryList. This class</p> <p>Performed java collection interface java.util.list, and java.util.map</p> <p>GET and PUT methods provide a more intuitive way to come in a simple XML tree structure</p> <p>Turn and return movement. You can use the standard abstraction of the Collections API (Abstract)</p> <p>Perform an iteration or subview, etc. There is a key in each entrance in Entrylist</p> <p>Key and a value, like MAP; key is the name of Child Nodes</p> <p>The value is either a string or is the next level (Child) XMLENTRYLISTS.</p> <p>XmlenTryList does not mean that you can completely replace DOM. It is still unable to perform some DOM</p> <p>Features. However, it is a convenient case (Wrapper) on your XML data structure.</p> <p>Used to perform basic Getting, Setting, and List-Oriented features. E.g,</p> <p>You can use this way to get the picture Node's CAPTION element:</p> <p>String capen = (string) PictureList.get ("caption");</p> <p>The value of the CAPTION field has been analyzed and stored as a string.</p> <p>Cache caching</p> <p>Despite many advantages, an XML file is always taken time. In order to improve the performance based on XML-based applications, you need to use some cache technology. This kind of cache must be in memory</p> <p>Save the XML object in the middle, remember which file they come from. If the object is loaded later</p> <p>Modified, the object needs to be reloaded. I developed a structure for this data structure</p> <p>Simple method called cachedfs.java. You can supply a cachedfs call back</p> <p>Back Function, use the internal class that actually performs XML analysis, turn the file to one</p> <p>Object. Cache can then store That object in memory.</p> <p>Here is the code created cache, this object has Application Scope, so after this</p> <p>The request can be used using the same object cache. I will put these code in Init.jsp, so you</p> <p>You do not have to scrapped these initialized code to other JSP files. In short, you must</p> <p>Define Application-Scope objects in a public place.</p> <p><jsp: usebean id = "cache" class = "com.purpletech.io.cachedfs" scope = "Applicatio</p> <p>N "></p> <p><% cache.setroot (Application.getRealPath);</p> <p>Cache.setLoader (new cachedfs.loader () {</p> <p>// Load in a Single Picture File</p> <p>Public Object Process (String Path, InputStream in) THROWS IOEXCEPTION</p> <p>{</p> <p>Try {</p> <p>Document doc = Domutils.xml4jparse</p> <p>NEW BufferedReader (New InputStreamReader (in));</p> <p>Element noderoot = doc.getdocumentelement ();</p> <p>Noderoot.normalize ();</p> <p>Picture Picture = New DomPicture (Noderoot);</p> <p>Return Picture;</p> <p>}</p> <p>Catch (XMLException E) {</p> <p>E.PrintStackTrace ();</p> <p>Throw new ioException (E.getMessage ());</p> <p>}</p> <p>}</p> <p>});</p> <p>%></p> <p></ jsp: usebean></p> <p>XPath</p> <p>XPath is a simple syntax for locating Node in XML Tree. It is more than DOM</p> <p>Easy to use, because</p> <p>When you want to transfer another Node, you don't have to generate a method call every time you can call it.</p> <p>The path is embedded in a string, for example:</p> <p>/ Picture / thumbnails / image [2].</p> <p>The resin product contains an XPath processor that you can add it to your own application.</p> <p>Go in. You can load itself with Caucho XPath objects, don't have to buy Resin</p> <p>Other products of the system.</p> <p>Node Verse = XPath.Find ("Chapter / Verse", Node);</p> <p>Resin also includes a scripting language, compatible with JavaScript, allowed in JSP</p> <p>Simple access to XPath and XSL.</p> <p>XSL</p> <p>This article discusses the Java to spread data from XML Node in JSP. Completely</p> <p>Sample work can also have another common model: Extensible Stylesheet Language (XSL).</p> <p>This model and JSP model have fundamentally different. In JSP, the main content is HTML, which contains</p> <p>Some Java codes; and in XSL, the main content is an XSL document, which contains some HTML fragments. If you want to discuss the relationship between XSL and Java / JSP, the space here has</p> <p>Not enough. In JavaWorld magazine, there will be an article to explore how to use XSL and</p> <p>JSP.</p> <p>Current conclusions and the road of future development</p> <p>After reading this article, I believe that you should have a JSP-XML app and its powerful power.</p> <p>Very good ideas and structural awareness. However, you must know some of its limitations.</p> <p>The most uburained in developing JSP-XML applications is the elements of each XML Schema</p> <p>ELEMENT creates JavaBean. XML Data Binding organization is developing a technology,</p> <p>You can automatically generate Java classes for each given Schema. Similarly, I have also developed</p> <p>A prototype - open source Java-XML Data Binding technology. In addition, IBM</p> <p>AlphaWork has recently introduced XML Master, or Xmas, this is another</p> <p>XML-Java Data Binding system.</p> <p>Another possibility is to expand the function of the file system, establish some more powerful features.</p> <p>Such as queries and transaction processing. Naturally, I have also begun to expect this type of functionality.</p> <p>Open source project is developed. So, who is willing to write an XML search engine</p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-30853.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="30853" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.052</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'G1y9MJ7HjS5nr78BxdtN_2B6uT1Y_2BoZ_2F_2Bf9QFYLy3_2B_2B9KlLcIkJecEquZwNF_2BqBvnkODMZW2iPcjwxIdrHfBAvNQ_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>