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 ...
随机推荐
- DOM结构学习备忘
1.动态修改页面title: document.title="项目启动33"; 2.IE中打开UTF-8编码的网页中title显示空白页的问题 3.
- C指针赋值
Node* p = A; Node* f = B; Node* t; t = p; t = f 本人试图让p指向B,但这样操作是不行的.如下图:只是改变了t的指向,p并没有变
- Data truncated for column 错误
今天插入mysql数据数据时,报错Data truncated for column.研究了一下原理是我数据的长途超出了该字段的最大长度,所以解决办法很简单,就是修改数据库中字段属性,使其长度增加即可 ...
- VC6.0编译boost
今天学习了下VC6.0下boost的编译,只是对regex进行了编译,据说全部编译需要2个多小时,在此记录下学习过程中遇到的问题以便今后查看. 最开始直接从网上(www.boost.org)下载了当前 ...
- Java线程角度的内存模型和volatile型变量
内存模型的目标是定义程序中各个变量的访问 规则,即在虚拟机中将变量(包括实例字段,静态字段和构成数组对象的元素,不包括局部变量与方法参数,因为后者是线程私有的)存储到内存和从内存中取出变量这样的底层细 ...
- c# 取得ip地址和网关
/// <summary> /// 得到本机IP /// </summary> private string GetLocalIP() { //本机IP地址 string st ...
- C语言带参数的main()函数
示例代码: #include<stdio.h> int main(int argc, char *argv[]) { int i; printf("Total %d argume ...
- 如何在CentOS5中增加CentALT的源
1. 建立centalt.repo 指令: vi /etc/yum.repos.d/centalt.repo 2. 將下面的內容貼進去 [CentALT] name=CentALT ...
- php实现input输入框失去焦点自动保存输入框的数据
最近做一个输入框失去焦点时自动保存数据的功能,当然就是jQuery选择器选择input,blur时,ajax提交数据给php文件,php文件保存一下数据咯.主要是要注意一下中文的问题,所以中间需要转一 ...
- 基于PinnedSectionListView实现联系人通讯录并且点击打电话
PinnedSectionListView具体下载地址.使用方法和注意事项:http://www.cnblogs.com/zzw1994/p/4997601.html 怎么根据联系人姓名首字符顺序读取 ...