【隐患排查系统】第一个项目总结

1、web前端与action的交互

（1）要求开发人员对JQuery的相关知识比较熟悉，包括JQuery常见的选择器、ajax调用的语法。

（2）当JSP页面（或模态框）需要数据时，如何初始化？

　　在当前JSP页面（js文件）中定义一个函数；

　　在函数中利用JQuery的ajax请求调用action；

　　在success回调函数中获得json数据，然后对界面中元素（table、select等等）进行初始化。

　　功能:(1)获取值；（2）利用值初始化界面元素

　　在$(function(){})中调用该函数

　　示例代码

（3）在显示一个jsp页面之前，如何先执行一个查询，然后用结果初始化table

（4）掌握对常见表单元素初始化

下拉列表（select）

表格（table）

/* 在表格中添加数据，清除表头（第一行）之外的所有行 */

$("#projectTable tr:not(:first)").html("");

单选按钮（radio）

（1）单选按钮内容来自数据库

（2）从数据库查询一条记录，根据结果设置单选按钮；

多选按钮（CheckBox）

（1）多选按钮内容来自数据库

（2）从数据库查询一条记录，根据结果设置单选按钮；

文本框（text）

树形控件

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script src="../js/jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script></head><body><center><!--文本框-->用户名:<input type="text" name="username" id="username" value="初始值" /><br /><br /><!--下拉列表-->部门:<select name="unit" id="unit" style="width: 200px;"><option value="0" selected>--请选择--</option><option value="1">部门1</option><option value="2">部门2</option></select><br /><!--多选框-->爱好:<input type="checkbox" name="aihao" id="" value="0" checked="checked" />篮球<input type="checkbox" name="aihao" id="" value="1" checked="checked" />足球<input type="checkbox" name="aihao" id="" value="2" />羽毛球<input type="checkbox" name="aihao" id="" value="3" />乒乓球<br /><!--单选框-->性别:<input type="radio" name="gender" id="" value="0" checked="checked" />男<input type="radio" name="gender" id="" value="1" />女<br /><br /><input type="button" id="" value="改变文本值" onclick="initText()" /><input type="button" id="" value="改变下拉列表值" onclick="changeSelect()" /><input type="button" id="" value="改变多选框值" onclick="changeCheckbox()" /><input type="button" id="" value="改变单选框值" onclick="changeRadio()" /><input type="button" id="" value="动态添加一个给下拉列表" onclick="addSelect()" /><script type="text/javascript">/*读取与改变文本框值*/function initText() {alert($("#username").val());$("#username").val("这是改变后的值");}/*读取与改变下拉列表值*/function changeSelect() {alert("选的值是" + $("#unit option:selected").val() + ",文本是:" + $("#unit option:selected").text());$("#unit").val("2");}function changeCheckbox() {/*获取多选框的值*///                    $aihaos是一个数组var $aihaos = $("[name='aihao'][checked]");alert("多选框选中个数:" + $aihaos.length);for(var i = 0; i < $aihaos.length; i++) {var value = $($aihaos[i]).val();alert(value);}/*设置为不选中状态*/$($aihaos).attr("checked", false);//设置其中一个为选中状态
                    $("[name='aihao'] :eq(2)").attr("checked", 'checked');}function changeRadio() {/*获取单选框的值*///                    $aihaos是一个数组var $aihaos = $("[type='radio'][checked]");alert("多选框选中个数:" + $aihaos.length);for(var i = 0; i < $aihaos.length; i++) {var value = $($aihaos[i]).val();alert(value);}//设改变单选框的值
                    $("[type='radio'] :eq(1)").attr("checked", 'checked');}//动态给下拉列表增加选项function addSelect() {var $unit = $("[name='unit']");alert("多选框选中个数:" + $unit.length);$unit.append("<option value='3'>部门3</option>");$("<option value='4'>部门4</option>").appendTo($unit);}</script></center></body></html>

（5）善于使用隐藏域

(6)JQuery操作table

删除表格中一行

Table中的编号没有更新，应该调用reload()方法重新加载页面；

（7）jQuery常见选择器

【隐患排查系统】第一个项目总结相关推荐

【升级公告】让双控更到位，晓帆隐患排查系统三大升级
好久不见,我们有个好消息跟大家分享--晓帆隐患排查系统升级啦!! 相比原来的版本,我们做了六大升级,新版本让晓帆隐患排查系统更简洁易用,帮大家解锁更好的使用体验,本篇先给大家讲解六大升级中的三大升级内 ...
VR/AR产品：VR火灾隐患排查系统再次升级，多种场景任你选择！
消防安全教育的普及是社会安全保障的基础,学习和掌握防火灭火.逃生保护等知识和技能.真实的事故总结和以往的经验,更有意义. VR火灾隐患排查是为了让广大人民群众.中小学生学习消防知识,体验消防文化,参加 ...
“二维码+小程序”隐患排查系统工作方案
通过二维码承载企业基本信息.日常巡查记录.督导检查记录.举报等详细信息,通过微信扫描企业二维码,就可以详细了解企业主体责任落实情况,该平台主要分为以下4个模块: 企业基本信息.通过手机扫一扫企业&qu ...
瑞熙贝通--学校安全检查和隐患排查系统
1.系统概述实验室管家系统针对人.机.物.环.管实验室常见五大危害因素,整合了化学品全生命周期管理.教育培训.实验准入.安全检查等多个功能,并有强大的后台数据库支撑,实现了"一瓶一码一人一 ...
unity之VR模拟消防安全隐患排查综合方案（家庭/校园/商场/地铁/工厂/办公室）
1.VR家庭火灾隐患排查体验者可以通过携带HTC VIVE 头盔切换和移动视角,并可以跟虚拟场景进行交互动作,逐一排查客厅,卧室,厨房,卫生间,阳台等地方的消防安全隐患点,沉浸式学习消防安全内容. ...
机房设备隐患排查及环境预警预测系统案例分享
机房设备隐患排查及环境预警预测系统机房设备在长期运行的过程中,因为本身老化或高温影响等情况会无可避免产生各种隐患,但是有些隐患是肉眼看不见的,比如蓄电池容量劣化.还有动态环境也是不可控的,比如空调漏水 ...
排查链接是否失效_锅炉主保护系统隐患排查与治理
欢迎关注"热控圈 " ID:rekongquan 传播热控知识,分享技术精华! 锅炉炉膛安全监控系统设计可靠与否直接关系到电站锅炉的安全运行,如果设计存在隐患,轻则造成锅炉灭火及机 ...
第一个项目学生评价综合系统
第一个项目:StudentSystem 学生评价综合系统(代码和具体开发步骤以后附上) 技术选型: 前端:AdminLTE(Bootstrap+CSS)框架后端:SSM(Spring+SpringM ...
wpsppt流程图联系效果_风险隐患排查的手段—HAZOP 与检查表的区别及应用效果
HAZOP 与检查表的区别 HAZOP 分析可以在工厂运行周期内的任何时间段进行,既适用于设计阶段,也适用于在役的工艺装置. 在化工项目的设计阶段采用HAZOP 方法进行分析,能识别设计.设备及操作程 ...

【隐患排查系统】第一个项目总结

【隐患排查系统】第一个项目总结相关推荐

最新文章

热门文章