jquery css 简单笔记
内容 要点：清空表单中所有数据，除去 button,submit,reset,hidden 的数据
- $(':input','#myform')
- .not(':button, :submit, :reset, :hidden')
- .val('')
- .removeAttr('checked')
- .removeAttr('selected');
It is using the :input
selector which will match all input, textarea, select and button elements. Since we are passing #myform
as the second argument, it will only find inputs inside this form
element. Then it filters out all buttons, submits, resets and hidden
inputs using not()
. Then it is using val()
to set the value of the remaining fields to an empty string, and then it uses removeAttr
to remove the checked
and selected
attribute of the fields in case you have any radio/checkbox/select inputs. Tada.
1、实例 数据来自后台，只写前台处理方法
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="erp" uri="/erp-tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<LINK href="../../../system/doctors/dept/styles.css" type="text/css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="../../../skin/style_140605.css" />
<script src="../../../system/doctors/dept/searchbox.js" charset="gbk" ></script>
<script language="javascript" src="../../../system/staff_manage/jilu/LodopFuncs.js"></script>
<script language="javascript" src="../../../jslib/json.js"></script>
<style>
#Tablist2 tr th{
word-break:keep-all;
}
</style>
<html>
<script>
jQuery(function(){
var data=${jobhistoryListjson}; //从后台获取列表数据
var datastr="";
jQuery.each(data, function(i, n){
//alert(JSON.stringify(n));
var index=i+1;
datastr+="<tr><td>"+index+"</td><td>"+n.user_name+"</td><td>"+n.dept_name+"</td><td>"+n.start_datetime+"</td><td>"+n.end_datetime+"</td>"
// +"<td>"+n.job+"</td><td style='width:400px;'>"+n.category+"</td><td>"+n.source+"</td><td>"+n.address+"</td><td>"+n.review+"</td><td>"+n.content+"</td>"
+"<td>"+n.job+"</td><td>"+n.category+"</td><td>"+n.source+"</td><td>"+n.address+"</td>"
+"<td><input data='"+JSON.stringify(n)+"' type='button' class='inputbutton' value='编辑' />"
+"<input data='"+n.jobhistory_id+"' type='button' class='inputbutton' value='删除' /></td></tr>";
});
jQuery("#Tablist2").append(datastr);
jQuery("#Tablist2 input[type='button']").click(function(){
if(jQuery(this).attr("value")=="编辑")
{
if(jQuery(this).attr("data")!=null&&jQuery(this).attr("data")!="")
{
var item = JSON.parse(jQuery(this).attr("data"));
jQuery("#jobhistory_jobhistory_id").val(item.jobhistory_id);
jQuery("#jobhistory_user_name").val(item.user_name);
jQuery("#jobhistory_dept_code").val(item.dept_code);
document.getElementById("jobhistory.start_datetime").value= item.start_datetime;
document.getElementById("jobhistory.end_datetime").value= item.end_datetime;
jQuery("#jobhistory_job").val(item.job);
jQuery("#jobhistory_category").val(item.category);
jQuery("#jobhistory_source").val(item.source);
jQuery("#jobhistory_address").val(item.address);
jQuery("#jobhistory_review").val(item.review);
jQuery("#jobhistory_content").val(item.content);
}
}
else if(jQuery(this).attr("value")=="删除")
{
if(jQuery(this).attr("data")!=null&&jQuery(this).attr("data")!="")
{
var deletes = jQuery(this).attr("data");
deleteDataall(deletes);
}
}
});
});
</script>
<body >
<br/>
<table cellpadding="0" cellspacing="0" id="Tablist2">
<tr>
<th width="30">序号</th>
<th width="150">医生</th>
<th width="150">科室</th>
<th width="150">开始时间</th>
<th width="150">结束时间</th>
<th width="150">担当职务</th>
<th width="400">工作类别</th>
<th width="150">任务来源</th>
<th width="150">地点</th>
<%--
<th width="350">工作评价</th>
<th width="350">工作内容</th>
--%>
<th>操作</th>
</tr>
</table>
<br />
<br />
<form action="" id="form1">
<table cellpadding="0" cellspacing="0" id="Tablist1">
<s:hidden name="jobhistory.jobhistory_id" ></s:hidden>
<s:hidden name="jobhistory.user_name" ></s:hidden>
<s:hidden name="jobhistory.dept_code" ></s:hidden>
<s:hidden name="dept_code"></s:hidden>
<s:hidden name="dengluming"></s:hidden>
<s:hidden name="userId"></s:hidden>
<input type="hidden" id="flagsString" name="flagsString" value="true"/>
<tr>
<td class="t_name">开始时间</td>
<td><input type="text" readonly="readonly" id="jobhistory.start_datetime" name="jobhistory.start_datetime" value="" class="datetimeText1" /></td>
<td class="t_name">结束时间</td>
<td><input type="text" readonly="readonly" id="jobhistory.end_datetime" name="jobhistory.end_datetime" value="" class="datetimeText1"/></td>
</tr>
<tr>
<td class="t_name">担当职务</td>
<td><s:textfield name="jobhistory.job" cssClass="required" ></s:textfield></td>
<td class="t_name">工作类别</td>
<td><s:select list="categoryList" name="jobhistory.category" listKey="dict_child_id" listValue="dict_child_name" headerKey="" headerValue="请选择" /></td>
</tr>
<tr>
<td class="t_name">任务来源</td>
<td><s:select list="sourceList" name="jobhistory.source" listKey="dict_child_id" listValue="dict_child_name" headerKey="" headerValue="请选择" /></td>
<td class="t_name">地点</td>
<td><s:textfield name="jobhistory.address" cssClass="required"></s:textfield></td>
</tr>
<tr>
<td class="t_name">工作评价</td>
<td><s:textarea name="jobhistory.review" style="width:320px"></s:textarea></td>
<td class="t_name">工作内容</td>
<td><s:textarea name="jobhistory.content" style="width:320px" ></s:textarea></td>
</tr>
<tr>
<td colspan="4" id="btn_control">
<input type="button" class="inputbutton" value="清空" title="清空" id="btnrest"/>
<input type="button" class="inputbutton" value="保 存" title="保存" onclick="saveNew();"/>
<input type="button" class="inputbutton" value="返 回" title="返回" onclick="goToBack();"/>
</td>
</tr>
</table>
</form>
</body>
</html>
<script type="text/javascript">
$(document).ready( function() {
$("#roleTable").tablesorter({
widgets: ['zebra','columnHighlight','rowHover'],
headers:{ 0: { sorter: false}},
cancelSelection:true
});
$("#btnrest").click(function(){
$("#jobhistory_jobhistory_id").val("");
$('input','#form1')
.not(':button,:submit,:reset,:hidden') //将myform表单中input元素type为button、submit、reset、hidden排除
.val('') //将input元素的value设为空值
.removeAttr('checked')
.removeAttr('selected'); // 如果任何radio/checkbox/select inputs有checked or selected 属
alert($('input','#form1'));
$('select','#form1')
.not(':button,:submit,:reset,:hidden') //将myform表单中input元素type为button、submit、reset、hidden排除
.val('') //将input元素的value设为空值
.removeAttr('checked')
.removeAttr('selected'); // 如果任何radio/checkbox/select inputs有checked or selected 属
alert($('select','#form1'));
$('textarea','#form1')
.not(':button,:submit,:reset,:hidden') //将myform表单中input元素type为button、submit、reset、hidden排除
.text("")
.removeAttr('checked')
.removeAttr('selected'); // 如果任何radio/checkbox/select inputs有checked or selected 属
alert($('textarea ','#form1'));
});
});
//删除组
function deleteDataall(deletes){
if(null!=deletes&&""!=deletes){
var deletes = deletes +'&dept_code=${dept_code}&dengluming=${dengluming}&userId=${userId}&flagsString=true';
deleteModify('removeJob.action','personIds='+deletes);//mian.js
}
}
//保存返回修改
function saveNew(){
var type=document.getElementById("jobhistory_jobhistory_id").value;
var src="saveJobForAll.action";
if(null!=type && ""!=type){
src="updateJobForAll.action";
}
document.getElementById("form1").action=src;
document.getElementById("form1").submit();
}
</script>
jquery css 简单笔记的更多相关文章
- jQuery+CSS 简单代码实现遮罩层( 兼容主流浏览器 )
/* ** jQuery版本:jQuery-1.8.3.min.js ** 浏览器:Chrome( v31.0.1650.63 m ),IE11,Firefox( v32.0.1 ),IETester ...
- web前端学习（三）css学习笔记部分（5）-- CSS动画--页面特效、HTML与CSS3简单页面效果实例
CSS动画--页面特效部分内容目前仅仅观看了解内容,记录简单笔记,之后工作了进行内容的补充 7. CSS动画--页面特效 7.1 2D.3D转换 7.1.1 通过CSS3转换,我们能够对元素进行 ...
- CSS学习笔记09 简单理解BFC
引子 在讲BFC之前,先来看看一个例子 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- js,jquery,css,html5特效
包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...
- jquery实现简单瀑布流布局（续）：图片懒加载
# jquery实现简单瀑布流布局(续):图片懒加载 这篇文章是jquery实现简单瀑布流布局思想的小小扩展.代码基于前作的代码继续完善. 图片懒加载就是符合某些条件时才触发图片的加载.最常见的具体表 ...
- jquery实现简单瀑布流布局
jquery实现简单瀑布流布局 是开头都会说的原理 瀑布流布局有两种,一种是固定列,一种是非固定列.在此主要记述第一种的实现. 固定列的特征是:无论页面如何缩放,每行的总列数都一致. 一行4列的瀑布流 ...
- jQuery源码笔记(二)：定义了一些变量和函数 jQuery = function(){}
笔记(二)也分为三部分: 一. 介绍: 注释说明:v2.0.3版本.Sizzle选择器.MIT软件许可注释中的#的信息索引.查询地址(英文版)匿名函数自执行:window参数及undefined参数意 ...
- 推荐20款基于 jQuery & CSS 的文本效果插件
jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...
- jquery实现简单的Tab切换菜单
实现tab切换的主要html代码: <div class="container"> <ul class="tabs"> <li c ...
随机推荐
- linux exec函数族
1.简介 在Linux中,并不存在exec()函数,exec指的是一组函数,一共有6个,分别是: #include <unistd.h> extern char **environ; ...
- 使用DriverManager获取数据库连接的一个小改进
由于使用DriverManager获取数据库连接时,由于DriverManager实现类中有一段静态代码块,可以直接注册驱动,且可以同时管理多个驱动程序 所以当换数据库连接时需要指定不同的数据库,那么 ...
- Hadoop 的部署适用性（网上资料http://www.linuxidc.com/Linux/2013-10/92141.htm）
近些年,Hadoop和“走向大数据分析引擎”一样,受到颇多赞誉.对很多人来说,Hadoop就意味着大数据技术.但其实开源的分布式处理框架未必能解决所有的大数据问题.这就要求想要部署Hadoop的公司慎 ...
- Delphi XE5教程7：单元引用和uses 子句
内容源自Delphi XE5 UPDATE 2官方帮助<Delphi Reference>,本人水平有限,欢迎各位高人修正相关错误! 也欢迎各位加入到Delphi学习资料汉化中来,有兴趣者 ...
- IIS6下， web.config配置为targetFramework="4.0"时出404错误
打开IIS管理器,在"Web 服务扩展" 中 将ASP.NET v4.0设置为允许就好了.这个选项默认是禁止的.
- XHTML1.0对HTML4.0的改进
1.XHTML借鉴了XML的写法,语法更加严格: 2.XHTML实现了把页面样式和内容分离了,废弃了HTML4.0中表示样式的标签和属性,推荐使用CSS样式来描述页面的样式. XHTML1.0 分为两 ...
- openerp经典收藏 OpenERP库存管理的若干概念讲解(新增库存价值)（转载）
OpenERP库存管理的若干概念讲解(新增库存价值) 原文:http://shine-it.net/index.php/topic,2425.0/topicseen.html 一.复式库存(Doubl ...
- gcc链接程序时出现undefined reference to""错误
如:: undefined reference to ‘mq_unlink',意思是指函数mq_unlink没有定义. 可以使用如下步骤找到该函数所在的库: 1).查找哪些库包含了或使用了该函数:gr ...
- WPF的Application类
本节主要介绍一下Application类的部分功能,我们首先来看一下如何使用Application类来加载一个窗口: 我们首先创建一个控制台程序,并引入相关的dll,然后修改Main()方法. [ST ...
- 无法打开物理文件xxx.mdf 操作系统错误 5:“5(拒绝访问。)” (Microsoft SQL Server，错误: 5120) 的解决方法
问题描述:在附加数据库到sql server时,附加不上,出现如下图所示的错误 解决方法:找到xxx.mdf和xxx_log.ldf文件, 点击“右键”->“属性”->"安全&q ...