1:animate 动画效果

$(function () {
$(".sidebar-nav a").mouseover(function () {
$(this).animate({ paddingLeft: "+=8px" },200);
});
$(".sidebar-nav a").mouseout(function () {
$(this).animate({ paddingLeft: "-=8px" }, 200);
});
});

效果:

参数 描述
styles

必需。规定产生动画效果的 CSS 样式和值。

可能的 CSS 样式值(提供实例):

注释:CSS 样式使用 DOM 名称(比如 "fontSize")来设置,而非 CSS 名称(比如 "font-size")。

speed

可选。规定动画的速度。默认是 "normal"。

可能的值:

  • 毫秒 (比如 1500)
  • "slow"
  • "normal"
  • "fast"
easing

可选。规定在不同的动画点中设置动画速度的 easing 函数。

内置的 easing 函数:

  • swing
  • linear

扩展插件中提供更多 easing 函数。

callback

可选。animate 函数执行完之后,要执行的函数。

如需学习更多有关 callback 的内容,请访问我们的 jQuery Callback 这一章。

 

2:二选一功能

问题是这样的:当我点击编辑按钮时会出现编辑的输入框,但是当我点击其它编辑按钮时,先前的那个输入框没有消失而再次点击的输入框也显示,如图:

想通过jquery实现:点击其它编辑按钮时,先前的编辑输入框消失而再次点击的输入框显示,这就是二选一功能,实现代码如下:

……

{
sTitle: "操作",
mData: null,
sClass: "lClass",
fnRender: function (oObj) {
return '<a href="#" onclick="javascript:edit(this)">编辑</a> | <a href="javascript:void(0)" onclick="del_click(\'' + oObj.aData.Id + '\')" class="editor_remove">删除</a>';
}
}

……

var e_tr = "";
function edit(e) {
cancelEdit();
e_tr = $(e).parent().parent(); var val = $(e).parent().parent().children("td:eq(0)").children().html();
$(e).parent().parent().children("td:eq(0)").children().attr("style", "display:none");
$(e).parent().parent().children("td:eq(0)").append("<span><input style='margin:0;padding:0 0 0 10px;height:20px;width:140px;border-radius:20px;font-size:10px;' type='text' onkeydown=' ' maxlength=30 value='" + val + "' />"
+ " <a href='#' class='button' onclick='return false;'>保存</a>"
+ " <a href='#' class='button red' onclick='javascript:cancelEdit();return false;'>取消</a></span>");
} function cancelEdit() {
if (e_tr) {
e_tr.children("td:eq(0)").children("span:eq(0)").attr("style", "display:inline");
e_tr.children("td:eq(0)").children("span:eq(1)").remove();
}
e_tr = null;
}

漂亮,成功实现了功能,其实之前也实现过类似的功能只是没有记录博客,以防下次会用到,这次参考的是csdn的代码(有csdn博客的朋友可以看看)。

JQuery 知识点的更多相关文章

  1. jQuery知识点总结(第二天)

    今天继续从我的笔记上面搬运.我们不产生知识,只是知识的搬运工. 内容过滤选择器: ○ 内容选择过滤器                                       $("div ...

  2. jQuery知识点总结(第一天)

    整理笔记前的题外话: 我认为互联网的高速发展其中最为主要的一点就是——开源. 开源精神,使得无数的IT爱好者贡献所学,将自己的智慧结晶无偿奉献给大家.后辈的学习者在混沌的互联网世界里,追寻着前辈们留下 ...

  3. Asp.Net 之Jquery知识点运用

    1.先把要用的body内的代码写好. <div id="ulBox"> <h3>下面的Ulid为"ulList1"</h3> ...

  4. JQuery知识点总结

    一. 1.JavaScript是Netscape公司开发的一种脚本语言(scripting language).JavaScript的出现实现了使得网页和用户之间实时的,动态的和交互的关系,使网页包含 ...

  5. Jquery知识点

    Jquery $代表选择器 JS 选取元素 操作内容 操作属性 操作样式 <div id="aa" style="width:100px; height:100px ...

  6. Jquery知识点梳理

    Jquery $代表选择器 JS 选取元素 操作内容 操作属性 操作样式 <div id="aa" style="width:100px; height:100px ...

  7. jQuery知识点一 each()和toggleClass()

    jQuery的一些东东比较容易忘,所以在这里整理一下... ... 1. each (1) $(selector).each(function(index,element))         inde ...

  8. JQUERY 知识点的自我总结

    一.名词释义 1 .js的入口函数:要等待文档树的加载完成,并且等待所有图片.文件都加载完成之后才开始执行. 2  .jquery入口函数会等待文档树的加载完成,并不会等待图片还有文件的加载 3 .j ...

  9. jQuery知识点总结(第六天)

    今天工作繁忙,晚上又和所谓的'朋友',吃了自助烧烤. 但我内心是很抗拒的,不知为了什么,竟然稀奇古怪的答应了下来,竟要去吃饭.我向来不喜欢去凑热闹,特别是和志趣不投的人在一起吃,对方所说的话,自己根本 ...

  10. jQuery知识点总结(第五天)

    节点的操作和数据库操作一样,无非是增.删.改.查. 今天总结删除节点.复制节点.替换节点.与包裹节点 删除节点: 如果文档中一个元素多余,那么就需要删除掉.jQuery提供了三种删除节点的方法.分别是 ...

随机推荐

  1. (转)MSMQ续

    原文作者:虔诚者    点此传送至原文 在上一篇我简单介绍了MSMQ的相关概念,本篇将以代码说明 Message Message是MSMQ的数据存储单元,我们的用户数据一般也被填充在Message的b ...

  2. spark RDD的元素顺序(ordering)测试

    通过实验发现: foreach()遍历的顺序是乱的 但: collect()取到的结果是依照原顺序的 take()取到的结果是依照原顺序的 为什么呢???? 另外,可以发现: take()取到了指定数 ...

  3. C# PLINQ 内存列表查询优化历程

    产品中(基于ASP.NET MVC开发)需要经常对药品名称及名称拼音码进行下拉匹配及结果查询.为了加快查询的速度,所以我最开始就将其加入内存中(大约有六万五千条数据). 下面附实体类. public ...

  4. javascript应用:页面解析list和map封装后的json数据

    开发web项目时,经常会使用到的页面脚本语言javascript,使用它能让页面展示上的效果更多彩. 今天就来说一下,从数据库中获取到数据后在页面上的展示方式: 1.数据库取出数据放入list< ...

  5. Eclipse配置安卓开发环境(解决SDK manager下载慢问题)

    Android新手在eclipse搭建安卓开发环境基本都会遇到Android SDK manager下载慢,ADT下载慢的问题,本文将带大家完整的安装一遍开发环境 工具:eclipse     SDK ...

  6. 关于WIFI的工作模式--AP MODE/STATION MODE

    wifi的concurrent mode 所谓wifi的共存模式,有以下几种: station mode + station mode station mode + ap mode station m ...

  7. Sql传参含有单引号

    程序 exec heduling_date_select ' Name like @%a%@ or phone like @%a%@ or Cus_code like @%a%@ or objjc l ...

  8. 关于百度编辑器UEditor(1.4.3)在C#.NET中的应用实例

    首先去百度UEditor官网下载 1.4.3 .net版本 http://ueditor.baidu.com/build/build_down.php?n=ueditor&v=1_4_3-ut ...

  9. javascript笔记---算法基础学习

  10. C#调用WinAPI及窗口过程

    C#调用WINAPI及Windows窗口消息的发与送 最近在做一个餐饮项目(C#Winform),其中有一块是做点菜宝接口的对接,点菜宝的厂商提供了一个WX.exe的驱动程序,这个驱动程序无直接打开, ...