บล็อกนี้แนะนำฟังก์ชั่นการปนเปื้อนตามเฟรมเวิร์ก ORM ของ Spring Data รวมถึง jQuery.pagination Plug-in
บล็อกนี้ขึ้นอยู่กับโครงการโอเพนซอร์ส GitHub ที่อยู่ภายใต้การพัฒนา ที่อยู่รหัสโครงการคือ: https://github.com/u014427391/jeepatform
ยินดีต้อนรับสู่ Star (คอลเลกชัน) หรือดาวน์โหลดเพื่อเรียนรู้และยังคงพัฒนา ...
แนะนำ Framework Spring Data
ข้อมูลฤดูใบไม้ผลิ: โครงการย่อยของฤดูใบไม้ผลิ ใช้เพื่อทำให้การเข้าถึงฐานข้อมูลง่ายขึ้นและรองรับ NOSQL และการจัดเก็บข้อมูลเชิงสัมพันธ์
ต่อไปนี้เป็นที่เก็บข้อมูล NOSQL ที่สนับสนุนโดยโครงการ SpringData:
* MongoDB (ฐานข้อมูลเอกสาร)
* neo4j (ฐานข้อมูลกราฟิก)
* redis (คีย์/ค่าที่เก็บ)
* HBASE (ฐานข้อมูลตระกูลคอลัมน์)
เทคโนโลยีการจัดเก็บข้อมูลเชิงสัมพันธ์สนับสนุนโดยโครงการ SpringData:
* JDBC
* JPA
ข้อมูลสปริง JPA: อุทิศให้กับการลดปริมาณการพัฒนาของเลเยอร์การเข้าถึงข้อมูล (DAO) นักพัฒนาเพียงแค่ต้องเขียนอินเทอร์เฟซเลเยอร์การคงอยู่และจากนั้นเฟรมเวิร์กอื่น ๆ จะช่วยให้โปรแกรมเมอร์ใช้งานได้
ขั้นตอนการพัฒนา:
【 Spring Data ใช้การเก็บข้อมูล】
โครงการนี้ใช้ Maven ดังนั้นคุณสามารถอ้างถึงการกำหนดค่า Maven ของฉัน:
<Project xmlns = "http://maven.apache.org/pom/4.0.0" xmlns: xsi = "http://www.w3.org/2001/xmlschema-instance" xsi: schemalocation = "http:/MANCMMMMMMMMMMMMMMMMMMMMMMMMMMBM http://maven.apache.org/maven-v4_0_0.xsd "> <carent> <ratifactid> Muses </artifactid> <roopId> org.muses </groupId> <Sersion> 1.0-SNAPSHOT </เวอร์ชัน> <ArtIfactId> jeepartform-admin </artifactid> <packaging> สงคราม </packaging> <name> jeepartform-admin Maven Webapp </name> <url> http://maven.apache.org </url> <properties> <pring-data-jpa.version> 1.4.2.release </spring-data-jpa.version> <pring-data-commons.version> 1.6.2.release </spring-data-commons.version> <hibernate.version> 4.3.8.final <lucene.version> 4.7.2 </lucene.version> <druid.version> 1.0.9 </druid.version> <poi.version> 3.7 </poi.version> </premerties> <cersion> $ {jeepatform.core.version} </version> </การพึ่งพา> <การพึ่งพา> <roupId> org.muses </groupId> <ratifactid> jeepatform-common </artifactid> <version> 1.0-snapshot </เวอร์ชัน> <ArtIfactId> jeepatform-oss </artifactid> <persion> $ {jeepatform.oss.ersion} </เวอร์ชัน> </การพึ่งพา> <predency> <sdependency> <roupid> org.muses </groupid> เริ่มต้น-> <predency> <roupId> javax.servlet </groupId> <ratifactid> servlet-api </artifactid> <sersion> 2.5 </เวอร์ชัน> <pope> ให้ </scope> <Sersion> 1.2 </Serve> </การพึ่งพา> <การพึ่งพา> <roupId> taglibs </groupId> <ratifactId> มาตรฐาน </artifactid> <cersion> 1.1.2 </version> </การพึ่งพาอาศัย> <!-JSTL end-> <! <cersion> $ {log4j.version} </เวอร์ชัน> </การพึ่งพา> <!-log4j end-> <!-การแยกวิเคราะห์ JSON ต้องเริ่มต้น-> <การพึ่งพา> <roupId> Commons-beanutils </groupid> <RoupID> Commons-Collections </groupID> <ratifactId> Commons-Collections </artifactid> <cersion> 3.2.1 </เวอร์ชัน> </การพึ่งพาอาศัยกัน> <perdency> <sderncy> <roupid> net.sf.ezmorph </groupid> <RoupID> Commons-Lang </GroupID> <ArtIfactId> Commons-Lang </artifactid> <version> 2.5 </เวอร์ชัน> </การพึ่งพาอาศัย> <pendency> <sdependency> <sdependency> <ArtIfactId> JSON-LIB </artifactId> <persion> 2.4 </เวอร์ชัน> <pley> jar </type> <classifier> jdk15 </clesifier> <pope> คอมไพล์ </scope> <ArtIfactId> mysql-connector-java </artifactid> <sersion> $ {mysql.version} </เวอร์ชัน> </การพึ่งพา> <!-mysql end-> <! <การพึ่งพา> <roupID> Commons-FileUpload </groupId> <ratifactId> Commons-FileUpload </ArtifactId> <Sersion> 1.2.2 </Servive> </การพึ่งพาอาศัยกัน> <!-Commons-> <! <cerson> $ {spring.version} </version> </การพึ่งพา> <การพึ่งพา> <loupId> org.springframework </groupId> <ratifactid> Spring-beans </artifactid> <version> $ {Spring.version} </เวอร์ชัน> <ArtIfactId> Spring-Context </artifactId> <persion> $ {Spring.version} </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา> <roupId> org.springframework </groupId> <ratifactId> Spring-context-support </artifactid> <RoupID> org.springframework </groupId> <ratifactId> Spring-Jdbc </artifactid> <version> $ {spring.version} </version> </derness> <การพึ่งพา> <loupid> org.springframework </groupid> </permentency> <การพึ่งพา> <roupId> org.springframework </groupId> <ratifactId> การทดสอบฤดูใบไม้ผลิ </artifactid> <persion> $ {Spring.version} </เวอร์ชัน> <Scope> ทดสอบ </pope> </การพึ่งพาการพึ่งพา> <Sersion> $ {Spring.Version} </เวอร์ชัน> </การพึ่งพาอาศัย> <!-Framework End Spring-> <!-Spring AOP เริ่มต้น-> <การพึ่งพา> <loupId> org.springframework </groupId> <roupId> org.aspectj </groupId> <ratifactid> APPERTIONSJWEAVER </artifactId> <Sersion> 1.6.10 </Side> </perdency> <!-Spring AOP End-> <! <Sersion> $ {Spring.Version} </Sident> </การพึ่งพาอาศัย> <!-SpringMvc End-> <!-การเริ่มต้นข้อมูลฤดูใบไม้ผลิ-> <การพึ่งพา> <GroupId> org.springframework </groupId> <RoupID> org.springframework.data </groupId> <ratifactId> Spring-Data-jpa </artifactid> <persion> $ {Spring-Data-jpa.version} </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา <ArtIfactId> Spring-Data-Commons </artifactid> <sersion> $ {Spring-Data-Commons.Version} </Service> </การพึ่งพาอาศัยกัน> <!-ปลายข้อมูลฤดูใบไม้ผลิ-> <! <ArtIfactId> Hibernate-JPA-2.1-API </artifactId> <Sersion> 1.0.0.Final </เวอร์ชัน> </การพึ่งพาอาศัย> <การพึ่งพา> <roupId> org.hibernate </groupId> <tifactId> <RoupID> org.hibernate </groupId> <ratifactId> Hibernate-entityManager </artifactid> <Sersion> $ {Hibernate.Version} </Sident> </การพึ่งพา> <!-Hibernate JPA end-> <! <ArtIfactId> SLF4J-API </artifactId> <sersion> 1.6.1 </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา> <roupId> net.sf.ehcache </groupid> <ratifactid> ehcache-core </artifactid> <version> 2.5.0 </เวอร์ชัน> <ArtIfactId> Hibernate-EHCACHE </artifactId> <persion> $ {hibernate.version} </เวอร์ชัน> </การพึ่งพา> <!-ปลาย echache ไฮเบอร์เนต-> <!-การเชื่อมต่อของ Alibaba <Sersion> $ {DRUID.Version} </เวอร์ชัน> </การพึ่งพาอาศัย> <!-การเชื่อมต่อของ Alibaba Pool Druid End-> <!-ปลาย echache ไฮเบอร์เนต-> <! <RoupID> org.apache.shiro </groupId> <ratifactid> Shiro-all </artifactid> <sersion> $ {Shiro.version} </sersion> </derpendency> <!-shiro end-> <! <Sersion> 1.6 </Serve> </การพึ่งพา> <การพึ่งพา> <roupId> org.apache.velocity </groupId> <ratifactid> Velocity-tools </artifactid> <version> 2.0 </Side> </การพึ่งพา> <!-Velocity End-> <! <ArtIfactId> Lucene-Core </artifactId> <persion> $ {lucene.version} </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา> <roupId> org.apache.lucene </groupId> <ratifactid> Lucene-Analyzers-common </artifactid> <roupId> org.apache.lucene </groupId> <ratifactid> lucene-QueryParser </artifactid> <version> $ {lucene.version} </version> </การพึ่งพา> <การพึ่งพา </permentency> <predency> <roupId> org.apache.lucene </groupId> <ratifactid> Lucene-Highlighter </artifactid> <persion> $ {Lucene.Version} </Serperency> </การพึ่งพาอาศัยตัวเอง <RoupID> org.wltea.analyzer </groupId> <ratifactid> ikanalyzer </artifactid> <persion> 2012ff_u1 </spope> <scope> ระบบ </scope> <SystemPath> $ {basedir} <!-Lucene Full Text Search Engine End-> <!-Log4j Start-> <การพึ่งพา> <roupId> log4j </groupId> <ArtIfactId> log4j </artifactid> <cersion> $ {log4j.version} </เวอร์ชัน> </การพึ่งพาการพึ่งพา> <! <ArtIfactId> Commons-Beanutils </artifactid> <sersion> 1.8.3 </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา> <roupId> Commons-collections </groupId> <ArtifactId> collections mommons </artifactid> <version> 3.2.1 <ArtIfactId> ezmorph </artifactId> <cersion> 1.0.6 </เวอร์ชัน> </การพึ่งพา> <การพึ่งพา> <roupId> Commons-Lang </groupId> <ratifactid> Commons-Lang </artifactid> <s/เวอร์ชั่น> <Sersion> 1.2 </Serve> </การพึ่งพา> <การพึ่งพา> <roupId> net.sf.json-Lib </groupId> <ArtIfactId> JSON-LIB </artifactId> <Sersion> 2.4 </เวอร์ชัน> <plem> jar </type> <classifier> jdk15 </scope POI Start-> <การพึ่งพา> <roupId> org.apache.poi </groupid> <ratifactid> poi </artifactid> <sersion> $ {poi <Sersion> 1.5.6 </Sentual> </derctency> <!-สิ้นสุดอีเมล-> </การพึ่งพา> <uffer> <finalName> jeepatform-admin </finalName> </uffer> </ched> ออกแบบฐานข้อมูลและเขียนคลาสเอนทิตี:
แพ็คเกจ org.muses.jeepatform.model.entity; นำเข้า java.util.date นำเข้า java.util.set; นำเข้า Javax.persistence.cascadetype; นำเข้า Javax.persistence.column; javax.persistence.generatedValue; นำเข้า Javax.persistence.generationType นำเข้า Javax.persistence.id; นำเข้า Javax.persistence.Joincolumn; นำเข้า Javax.persistence. javax.persistence.temporaltype;/***คลาสเอนทิตีของข้อมูลผู้ใช้*@author nicky*/@entity@table (name = "sys_user") ผู้ใช้ระดับสาธารณะ {/** รหัสผู้ใช้ **/รหัส int ส่วนตัว; / ** ชื่อผู้ใช้ **/ ชื่อผู้ใช้สตริงส่วนตัว; / ** รหัสผ่านผู้ใช้ **/ รหัสผ่านสตริงส่วนตัว; / ** หมายเลขโทรศัพท์มือถือ **/ โทรศัพท์ INT ส่วนตัว; / ** เพศ **/ เซ็กซ์สตริงส่วนตัว; / ** อีเมล **/ อีเมลสตริงส่วนตัว; / ** หมายเหตุ **/ เครื่องหมายสตริงส่วนตัว; / ** ระดับผู้ใช้ **/ อันดับสตริงส่วนตัว; / ** ครั้งสุดท้าย **/ วันที่ส่วนตัว lastlogin; / ** เข้าสู่ระบบ IP **/ ล็อกอินสตริงส่วนตัว; / ** เส้นทางรูปภาพ **/ สตริงส่วนตัว ImageUrl; / ** เวลาลงทะเบียน **/ วันที่ส่วนตัว regtime; / ** ไม่ว่าบัญชีจะถูกล็อค **/ บูลีนส่วนตัวล็อค = บูลีน. false; ชุดส่วนตัว <Roes> บทบาท; @GeneratedValue (Strategy = GenerationType.Identity) @ID สาธารณะ int getId () {return id; } โมฆะสาธารณะ setId (int id) {this.id = id; } @column (ไม่ซ้ำกัน = true, length = 100, nullable = false) สตริงสาธารณะ getUserName () {return username; } โมฆะสาธารณะ setUserName (ชื่อผู้ใช้สตริง) {this.userName = ชื่อผู้ใช้; } @column (length = 100, nullable = false) สตริงสาธารณะ getPassword () {ส่งคืนรหัสผ่าน; } โมฆะสาธารณะ setPassword (รหัสผ่านสตริง) {this.password = รหัสผ่าน; } public int getphone () {return phone; } โมฆะสาธารณะ setphone (โทรศัพท์ int) {this.phone = โทรศัพท์; } @Column (ความยาว = 6) สตริงสาธารณะ getSex () {return sex; } โมฆะสาธารณะ setsex (String sex) {this.sex = sex; } @column (ความยาว = 100) สตริงสาธารณะ getEmail () {return email; } โมฆะสาธารณะ setEmail (อีเมลสตริง) {this.email = อีเมล; } @column (ความยาว = 30) สตริงสาธารณะ getmark () {return mark; } โมฆะสาธารณะ setmark (เครื่องหมายสตริง) {this.mark = mark; } @column (ความยาว = 10) สตริงสาธารณะ getRank () {return roin; } โมฆะสาธารณะ setrank (อันดับสตริง) {this.rank = อันดับ; } @temporal (temporaltype.date) วันที่สาธารณะ getLaStlogin () {return lastlogin; } โมฆะสาธารณะ setLastlogin (วันที่ lastlogin) {this.lastlogin = lastlogin; } @column (ความยาว = 100) สตริงสาธารณะ getLoginip () {return loginip; } โมฆะสาธารณะ setLoginip (สตริงล็อกอิน) {this.loginip = loginiP; } @column (ความยาว = 100) สตริงสาธารณะ getImageUrl () {return imageUrl; } โมฆะสาธารณะ setImageUrl (String ImageUrl) {this.imageUrl = imageUrl; } @temporal (temporaltype.date) @column (nullable = false) วันที่สาธารณะ getregtime () {return regtime; } โมฆะสาธารณะ setregTime (date regtime) {this.regtime = regtime; } บูลีนสาธารณะ getLocked () {return locked; } โมฆะสาธารณะ setLocked (boolean ล็อค) {this.locked = ล็อค; -เขียนอินเทอร์เฟซเพื่อใช้งานส่วนต่อประสาน PagingandsortingRepository ของ Framework Spring Data Framework
แพ็คเกจ org.muses.jeepartform.repository; นำเข้า org.muses.jeepartform.model.entity.user; นำเข้า org.springframework.data.domain.page; นำเข้า org.springframework.data.domain.pagable; org.springframework.data.jpa.repository.jparepository; นำเข้า org.springframework.data.repository.query; นำเข้า org.springframework.data.repository.pagingandsortingrepository; java.util.date; อินเทอร์เฟซสาธารณะ userrepository ขยาย pagingandsortingRepository <ผู้ใช้, จำนวนเต็ม> { /*ผู้ใช้ findByUserName (ชื่อผู้ใช้สตริง); @Query ("จากผู้ใช้ u โดยที่ U.USERNAME =: ชื่อผู้ใช้และ U.Password =: รหัสผ่าน") ผู้ใช้ findByUserNameAnDPassword (@param ("ชื่อผู้ใช้") สตริงสตริง @Param ("รหัสผ่าน") รหัสผ่านสตริง); @Query ("จากผู้ใช้ u โดยที่ U.ID =: id") ผู้ใช้ findById (@param ("id") ID int); @Query ("จากผู้ใช้ u โดยที่วันที่ _format (u.lastlogin, 'yyyy-mm-dd') ระหว่างวันที่ _format ((: startdate), 'yyyy-mm-dd') และ date_format (: enddate), 'yyyy-mm-dd') สามารถแยกเพดานได้);*/}การใช้งานชั้นธุรกิจ:
แพ็คเกจ org.muses.jeepatform.service; นำเข้า java.util.*; นำเข้า org.muses.jeepatform.model.entity.user; นำเข้า org.muses.jeepatform.repository.userrepository; org.springframework.data.domain.page; นำเข้า org.springframework.data.domain.pageRequest; นำเข้า org.springframework.data.domain.sort; นำเข้า org.springframework.data.jpa.domain.specification; org.springframework.transaction.annotation.transactional; นำเข้า javax.persistence.criteria.criteriaBuilder; นำเข้า Javax.persistence.criteria.criteriaquery;/*** @description คลาสธุรกิจสำหรับการจัดการข้อมูลผู้ใช้ UserRepository UserRepository; / ** * สร้างวัตถุ PageRequest * @param num * @param ขนาด * @param asc * @param String * @return */ PAGEEREQUEST BUILDPAGEREQUEST (int จำนวน, ขนาด int, sort.direction asc, สตริงสตริง) {ส่งคืน pageRequest ใหม่ (num-1, ขนาด } / *** รับข้อมูลเมนูทั้งหมดและแสดงบนหน้า* @param pageno* จำนวนหน้าปัจจุบันของหน้า* @param หน้า* จำนวนหน้าต่อหน้า* @return* / @transactional หน้าสาธารณะ <user> findall (int pageno หน้า <ผู้ใช้> ผู้ใช้ = userRepository.Findall (คำขอ); ผู้ใช้ที่ส่งคืน; -คลาสควบคุมใช้เฟรมเวิร์ก SpringMVC ก่อนอื่นเขียน basecontroller เพื่อใช้งานฟังก์ชั่นทั่วไปบางอย่าง:
แพ็คเกจ org.muses.jeepatform.web.controller; นำเข้า javax.servlet.http.httpservletrequest; นำเข้า org.slf4j.logger; นำเข้า org.slf4j.loggerfactory; org.springframework.web.context.request.servletrequestattributes; นำเข้า org.springframework.web.servlet.modelandview; Basecontroller คลาสสาธารณะ {logger log = null; / *** รับวัตถุบันทึก* @return*/ Public Logger getInstance () {ถ้า (log == null) {log = loggerFactory.getLogger (basecontroller.class); } return log; } / *** รับวัตถุคำขอ* / สาธารณะ httpservletRequest getRequest () {httpservletRequest Request = ((servletRequestattributes) requestcontextholder.getRequestattributes ()) getRequest (); คำขอส่งคืน; } / ** * รับ modelandview * / public modelandview getModelandView () {ส่งคืน modelandview ใหม่ (); -การใช้งานคลาสควบคุม:
แพ็คเกจ org.muses.jeepatform.web.controller; นำเข้า net.sf.json.jsonarray; นำเข้า net.sf.json.jsonobject; นำเข้า net.sf.json.jsonconfig; นำเข้า org.apache.Commons.Collections.map.hashedmap; org.muses.jeepatform.core.excelviewwrite; นำเข้า org.muses.jeepatform.core.javaemailsender; นำเข้า org.muses.jeepatform.model.entity.user; นำเข้า org.muses.jeepatform.service.userservice; org.muses.jeepatform.utils.datejsonvalueprocessor; นำเข้า org.muses.jeepatform.utils.dateutils; นำเข้า org.springframework.beans.factory.annotation.autowired; org.springframework.data.domain.sort; นำเข้า org.springframework.steretype.controller; นำเข้า org.springframework.ui.model; นำเข้า org.springframework.web.bind.annotation. org.springframework.web.bind.annotation.requestparam; นำเข้า org.springframework.web.bind.annotation.responsebody; นำเข้า org.springframework.web.servlet.modelandview; javax.servlet.http.httpservletResponse; นำเข้า java.io.printwriter; นำเข้า java.util.*;/*** สร้างโดย Nicky เมื่อ 2017/7/29 */@requestmapping ("/user")@controllerpublic คลาส usercontroller ขยาย basecontroller {@autowired userservice userservice; /** * สอบถามข้อมูลผู้ดูแลระบบทั้งหมดและแสดงบนหน้า * @param Request * @param Response * @param model * @return */@requestmapping (value = "/queryall", ผลิต = "แอปพลิเคชัน/json; charset = utf-8" pageindexstr = request.getParameter ("PageIndex"); // จำนวนหน้าต่อหน้า int pagesize = ค่าคงที่. page_size; ModelAndView MV = this.getModelandView (); หน้า <ผู้ใช้> UserPage; if (pageindexstr == null || "". equals (pageindexstr)) {pageindexstr = "0"; } int pageindex = integer.parseint (pageindexstr); userpage = userservice.findall (PageIndex+1, pageSize, sort.direction.asc, "id"); mv.addobject ("TotalCount", userPage.getTotalElements ()); mv.addobject ("pageindex", pageindex); // jsonconfig cfg = new jsonConfig (); // cfg.setexcludes (สตริงใหม่ [] {"handler", "hibernatelazyinitializer"}); JSONCONFIG JCG = new JSONCONFIG (); JCG.REGISTERJSONVALUEPROCOSSOR (Date.Class, DatejsonValueProcessor ใหม่ ("YYYY-MM-DD")); jsonarray jsonarray = jsonarray.fromobject (userpage.getContent (), jcg); //system.out.println (jsonarray.toString ()); mv.addobject ("ผู้ใช้", jsonarray.toString ()); mv.setViewName ("ผู้ดูแลระบบ/ผู้ใช้/sys_user_list"); กลับ MV; - 【การใช้งานหน้า front-end 】
การใช้งานการดูหน้าดู jQuery.pagination.js (pagination js) และ pagination.css (รูปแบบการแบ่งหน้า CSS)
คุณสามารถดาวน์โหลดได้ที่นี่: //www.vevb.com/article/105013.htm
<%@ page contentType = "text/html; charset = utf-8" pageencoding = "utf-8"%> <%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core"%> uri = "http://java.sun.com/jsp/jstl/fmt"%> <% String Path = request.getContextPath (); String basepath = request.getScheme ()+": //"+request.getServerName ()+":"+request.getServerport ()+path+"/";%> <! doctype html> <html lang = "zh-cn"> <head> charset = "utf-8"/> <meta http-equiv = "x-ua ที่เข้ากันได้" เนื้อหา = "ie = edge"> <meta name = "viewport" content = "width = ความกว้างของอุปกรณ์, ระดับเริ่มต้น = 1"> <title> href = "<%= basepath%> ปลั๊กอิน/หน้า/css/bootstrap-3.3.5.min.css" rel = "ภายนอก nofollow"/> <! rel = "external nofollow"/> <script type = "text/javascript" src = "<%= basepath%> ปลั๊กอิน/หน้า/js/jQuery.min.js"> </script> <! src = "<%= basepath%> ปลั๊กอิน/หน้า/js/jQuery.pagination.js"> </script> <script type = "text/javascript">/** สำหรับการดำเนินการเพจการใช้งาน jQuery.pagination plugin เพิ่มโดย Nicky 20170729 เริ่มต้น ** // // ปริมาณข้อมูล var totalCount = number ($ {TotalCount}); $ (เอกสาร) .ready (function () {// การเชื่อมโยงกับ paging $ ("#pagination"). pagination (TotalCount, {callback: pagelectCallback, prev_text: '<หน้าก่อนหน้า', next_text: 'หน้าถัดไป> "ผู้ใช้/queryall? PageIndex = __ id__" // js เพจจะแทนที่โดยอัตโนมัติ "__id__" ด้วยหมายเลขปัจจุบัน obj.email; var lastlogin = obj.lastlogin; "<td>"+Mark+"</td>"+"<td>"+โทรศัพท์+"</td>"+"<td>"+อีเมล+"</td>"+"<td>"+lastlogin+"</td>"+"<td>" href = 'JavaScript: OpenItDialog ("+id+");' class = 'bouncein'> กำหนดค่า </a> "+" </tr> ";}); $ ("#content "). // เหตุการณ์นี้เป็นฟังก์ชัน PageSelectCallback (ดัชนี, jq) {}/** การดำเนินการ pagination โดยใช้ปลั๊กอิน jQuery.pagination เพิ่มโดย Nicky 20170729 End **/// ช่องทำเครื่องหมายทั้งหมด/anti-select var ischeckall = false; ฟังก์ชั่น docheck () {ถ้า (ischeckall) {$ ("อินพุต [type = 'ช่องทำเครื่องหมาย']") แต่ละ (ฟังก์ชั่น () {this.checked = false;}); ischeckall = false; } else {$ ("input [type = 'copbox']") แต่ละ (ฟังก์ชั่น () {this.checked = true;}); ischeckall = true; }} </script> </head> <body> <br> <div> <div> <div> <div> <form> <อินพุต type = "button" value = "Send Mail" onClick = "SendEmail ();" /> <อินพุต type = "button" value = "sendsms ();" /> <อินพุต type = "button" value = "Table ExportExcel" onClick = "ExportExcel ();" /> <br> <br> <!-<อินพุต type = "text" id = "คำหลัก" placeholder = "โปรดป้อนคำหลัก"> วันที่ <อินพุต type = "text" placeholder = "โปรดป้อนวันที่เริ่มต้น" value = "$ {startDate}" id = "startDate" ชื่อ = "startDate" , maxdate: '#f {$ dp. $ d (/' enddate/')}'}); "/> ถึง <อินพุตประเภท =" ข้อความ "placeholder =" โปรดป้อนวันที่สิ้นสุด "ค่า =" $ {enddate} "id =" enddate "ชื่อ =" enddate "onclick =" wdatepicker , Mindate: '#f {$ dp. $ d (/' startdate/')}'}); ' /> <อินพุต type = "button" value = "search" onclick = "dosearch ();"/>-> </form> <table id = "mtable"> <thead> <tr> <th> <อินพุต type = "ช่องทำเครื่องหมาย" onclick = "docheck ();" /> </th> <th> หมายเลขซีเรียล </th> <th> ชื่อผู้ใช้ </th> <th> คำอธิบาย </th> <th> มือถือ </th> <th> อีเมล </th> <th> การเข้าสู่ระบบล่าสุด </th> <th> การเข้าสู่ระบบครั้งสุดท้าย </th> <th> <!-การสาธิต-> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html> หน้าจอแสดงผล:
ตกลงบล็อกนี้ขึ้นอยู่กับโครงการโอเพนซอร์ส GitHub ที่อยู่ภายใต้การพัฒนา ที่อยู่รหัสโครงการคือ: https://github.com/u014427391/jeepatform
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น