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 ...
随机推荐
- 标识域 Identify Field
在对象中保存DB的ID字段,以维持内存对象和DB数据Row之间的identify. 关系DB使用key来区分数据行. 而内存对象不需要这样的键.因为对象系统能够保证身份确认. 读取时没有问题,但是为了 ...
- (转)hessian源码分析（一）------架构
在计费中心的对外交互这块采用了hessian,有必要对hessian的运行机理和源码做一定的解析. 大致翻了翻源码后,发现hessian的主要结构分客户端与服务端,中间基于http传输.客户端主要做的 ...
- 对ASP.Net的认识（三）
较为详细的整个请求处理流程 Application: BeginRequestApplication: PreAuthenticateRequestApplication: AuthenticateR ...
- Map排序(按key/按value)
package com.abc.test; import java.util.ArrayList; import java.util.Arrays; import java.util.Collecti ...
- mongodb gdal 矢量数据格式驱动
写了个mongodb的gdal driver,放在了github上,如果你需要,欢迎加入mongogis group. 直接的效果是使得QGIS, GeoServer, MapServer, ArcG ...
- Linux 伙伴算法简介
本文将简要介绍一下Linux内核中的伙伴分配算法. Technorati 标签: 伙伴算法 算法作用 它要解决的问题是频繁地请求和释放不同大小的一组连续页框,必然导致在已分配 ...
- JS事件冒泡与捕获
1事件传播——冒泡与捕获 默认情况下,事件使用冒泡事件流,不使用捕获事件流.然而,在Firefox和Safari里,你可以显式的指定使用捕获事件流,方法是在注册事件时传入useCapture参数,将这 ...
- [大牛翻译系列]Hadoop（15）MapReduce 性能调优：优化MapReduce的用户JAVA代码
6.4.5 优化MapReduce用户JAVA代码 MapReduce执行代码的方式和普通JAVA应用不同.这是由于MapReduce框架为了能够高效地处理海量数据,需要成百万次调用map和reduc ...
- 2013-07-22 IT 要闻速记快想
### ========================= ### 如何让用户点击广告.观看广告并乐在其中?这个问题的答案精彩纷呈.有的公司开创模式,为点击广告的用户提供优惠券:有的公司想法新奇,让用 ...
- php操作mysql数据库的基本类
代码如下 复制代码 <?php$dbhost='localhost';$dbuser='root';$dbpass='123456';$dbname='products';$connect=my ...