jquery 点滴
jQuery——动态给表格添加序号
$(function(){
//$('table tr:not(:first)').remove();
var len = $('table tr').length;
for(var i = 1;i<len;i++){
$('table tr:eq('+i+') td:first').text(i);
}
});
原始代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://common.cnblogs.com/script/jquery.js"
type="text/javascript"></script>
<title>jQuery</title>
</head>
<body>
<table width=500 border=2>
<tr><td width=250>序号</td><td width=250>项目</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
<tr><td></td><td>Port</td></tr>
</table>
</body>
</html>
变成
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://common.cnblogs.com/script/jquery.js"
type="text/javascript"></script>
<title>jQuery</title>
</head>
<body>
<table width=500 border=2>
<tr><td width=250>序号</td><td width=250>项目</td></tr>
<tr><td>1</td><td>Port</td></tr>
<tr><td>2</td><td>Port</td></tr>
<tr><td>3</td><td>Port</td></tr>
<tr><td>4</td><td>Port</td></tr>
<tr><td>5</td><td>Port</td></tr>
<tr><td>6</td><td>Port</td></tr>
<tr><td>7</td><td>Port</td></tr>
<tr><td>8</td><td>Port</td></tr>
</table>
</body>
</html>
Jquery工作常用实例--ajaxStart与ajaxStop(ajaxComplete)
("#loading").ajaxStart(function(){ $(this).show(); //callback })：当一个当Ajax请求开始时将把id为"loading"的内容显示；
("#loading").ajaxStop(function(){ $(this).hide(); //call })：当一个当Ajax请求结束时将把id为"loading"的内容隐藏；
<script>
$(document).ready(function(){ $("#loading").ajaxStart(function(){
$(this).show();
}).ajaxStop(function(){//ajaxStop改为ajaxComplete也是一样的
$(this).hide();
}); $("#o").click(function(){
$.post("for.php?id=o",function(data){
$("#content").html(data);
});
}) $("#p").click(function(){
$.post("for.php?id=p",function(data){
$("#content").html(data);
});
}) $("#q").click(function(){
$.post("for.php?id=q",function(data){
$("#content").html(data);
});
}) })
</script>
jQuery判断展示的元素，并获取显示元素数据
// 获取显示元素的数据
jQuery(this).find("a:visible").attr("href"); // 多级标签选择器
jQuery("#slider").click(function(){ var rel = jQuery(".nivo-controlNav a.active").attr("rel"); location.href = jQuery(this).find("a").eq(rel).attr("href"); }); // 判断元素是否显示
$(document).ready(function(){ if($("#mydiv").is(":visible")==false){ alert("Hidden"); }else{ alert("Display"); } });
如何判断jquery选择器选择结果为空
$("#id").length
这样就可以通过这样判断是否存在符合选择器条件的内容存在了
Jquery判断当前点击在表格的第几行第几列
$(document).ready(function(){
$(".mytable td").click(function(){
var tdSeq = $(this).parent().find("td").index($(this)[0]);
var trSeq = $(this).parent().parent().find("tr").index($(this).parent()[0]);
alert("第" + (trSeq + 1) + "行，第" + (tdSeq + 1) + "列");
});
})
jquery table 增加两行,删除两行,并且有跨行rowspan
//先删除当前行的下面的一行
$(obj.parentNode.parentNode).next().remove();
//然后再删除当前行
$(obj.parentNode.parentNode).remove();
区间代码 获取序号2-5之间的数
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul> $("li:lt(5)").filter(":gt(2)").prependTo('ul');
$("li:lt(5):gt(2)").prependTo('ul');
jQuery 获取当前节点的html包含当前节点的方法
<div class="test"><p>hello，你好！</p></div>
<script>
$(".test").prop("outerHTML");
</script> 输出结果为：<div class="test"><P>hello,你好！</p></div>
jQuery 追加元素的方法
append() 方法在被选元素的结尾插入内容。
prepend() 方法在被选元素的开头插入内容。
after() 方法在被选元素之后插入内容。
before() 方法在被选元素之前插入内容。
jquery版本之间的冲突
<!-- 引入1.6.4版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
<script> var jq164 = jQuery.noConflict(true); </script>
<!-- 引入1.4.2版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script> var jq142 = jQuery.noConflict(true); </script> <script>
(function($){
//此时的$是jQuery-1.6.4
$('#header');
})(jq164);
</script> <script>
(function($){
//此时的$是jQuery-1.4.2
$('#footer');
})(jq142);
</script>
table
获取table最后一行 $("#tab tr:last")
获取table第一行 $("#tab tr").eq(0)
获取table倒数第二行 $("#tab tr").eq(-2)
获取table总行数 $("#tab").find("tr").length
jquery 屏蔽一个区域内的所有元素，禁止输入
<script type="text/javascript">
(function($) {
$.fn.disable = function() {
return $(this).find("*").each(function() {
$(this).attr("disabled", "disabled");
});
}
$.fn.enable = function() {
return $(this).find("*").each(function() {
$(this).removeAttr("disabled");
});
}
})(jQuery);
</script> <script type="text/javascript">
$(document).ready(function() {
$("#div_test").disable();
});
</script>
除了某个元素 not
$(".r_options_title").click(function(){
$(this).parents("li").enable();
$(".r_options_title").not(this).parents("li").disable();
});
jquery 点滴的更多相关文章
- jquery点滴
1.toggle 2.next prev after before 3.on 4.当我们使用jquery的attr('checked',true)或者attr('checked','checked') ...
- JQuery点滴记录-持续更新
1. 获取各个控件的值 1)获取textArea等控件的值 2)获取span的值 3)删除ul下的所以li 2. jquery获取服务器控件dropdownlist的值 ddl_Type2为dropd ...
- [jquery] jQuery点滴[持续更新]
001.查看jquery的版本. $(function(){ console.log($()); //jquery console.log($().jquery); }); 002.(new Func ...
- jquery点滴总结
1.empty().remove().detach() empty():只移除了 指定元素中的所有子节点,而留下 了<p></p>,仍保留其在dom中所占的位置. remove ...
- [ASP.NET 技术点滴] Jquery 前端验证
先上HTML代码: <form id="login" name="login" action="~/f_login/Login" me ...
- 点滴积累【JS】---JQuery实现条形统计图，适用于选择题等统计
效果: 思路:前台JS实现动态数据效果,后台可以拼接字符串或者用JSON加载数据 代码: <%@ Page Language="C#" AutoEventWireup=&qu ...
- 关于JQuery.form.js异步上传文件点滴
好久没动代码了,前几天朋友委托我帮忙给做几个页面,其中有个注册带图片上传的页面.已之前的经验应该很快就能搞定,没想到的是搞了前后近一天时间.下面就说说异步上传的重要几个点,希望自己下次遇到此类问题的时 ...
- jQuery和js使用点滴
1.checkbox全选按钮 <input type="checkbox" name="allcheck" id="allcheck" ...
- 关于asp.net与jquery ajax 的一些补充
补充1:asp.net 与后台交互除了用之前写得$.ajsx()外 还可以直接使用$.get() , $.post()等. 补充2:jquery 跨域请求 例如: JSONP 跨域: $.ajax( ...
随机推荐
- MySQL错误问题
启动Tomcat的时候报错:no suitable driver,MySql更新使用com.mysql.cj.jdbc.Driver,废弃老的com.mysql.jdbc.Driver驱动,需要将D: ...
- @autoclosure-可以让表达式自动封装成一个闭包：输入的是一个表达式
@autoclosure 在闭包前面加上@autoclosure func or(first:Bool,@autoclosure second:()->Bool) -> Bool { if ...
- 【转】Impala安装json解析udf插件
背景 Impala跟Hive一样,是常用的数据仓库组件之一.熟悉Hive的同学肯定知道,Hive官方提供了get_json_object函数用于处理json字符串,但是Impala官方并没有提供类似的 ...
- C#POST 支付宝/微信回调接口
一般支付宝/微信的回调接口都会返回xml格式,下面是调用类似这种接口的办法: public async Task<string> GetData() { string requestUrl ...
- ovs的卸载
使用apt-get安装的openvswitch,然后卸载好麻烦撒,而且还没有相关资料说一下怎么删除的,特此记录一下,希望有个参考 首先把服务器上使用ovs新建的虚拟网桥全部删除掉 然后把原有的内核删除 ...
- SQL中对连表查询的建议
多表连查时,如果存在多个唯一键可以做关联,尽可能选择有意义的code或name,能不选择无意义的id或者uuid最好! 所以在存储的时候也是这样,并且从始至终保持一致性.这样既降低了维护和阅读的难度, ...
- 具有代码执行潜力的Vimeo SSRF
最近我在Vimeo上发现了一个半响应的SSRF代码执行的可能性.这篇博客文章解释了我是如何找到并利用它的. 背景 Vimeo为其API提供了一个名为API Playground的API控制台,使用此W ...
- iOS11、iPhone X、Xcode9 适配指南
更新iOS11后,发现有些地方需要做适配,整理后按照优先级分为以下三类: 1.单纯升级iOS11后造成的变化: 2.Xcode9 打包后造成的变化: 3.iPhoneX的适配 一.单纯升级iOS11后 ...
- mysql alter 增加修改表结构及约束
1) 加索引,添加时若未指定索引名,默认为字段名 mysql> alter table 表名 add index 索引名 (字段名1[,字段名2 …]); 例子: mysql> alt ...
- 登录验证码的生成Java代码
package example7; import java.awt.Color;import java.awt.Font;import java.awt.Graphics2D;import java. ...