jquery如何获取取元素序号,例如一个有N行的table,点击其中的一行,获取到它的行号。

jquery如何获取取元素序号,例如一个有N行的table,点击其中的一行,获取到它的行号。,第1张

可以用jQ的index()方法,举例:

<table id="table1">

<tr>

<td>第1行</td>

</tr>

<tr>

<td>第2行</td>

</tr>

<tr>

<td>第3行</td>

</tr>

<tr>

<td>第4行</td>

</tr>

</table>$('#table1')find('tr')click(function() {

var idx = $(this)index() + 1;  // 索引是从0开始的,故+1

consolelog('点击了第' + idx + '行');

});

$('div2')on('click',function(){

    $span = $('span')text();

    alert($span);

});

很简单的。去看看慕课网上的基础课程吧。多看看文档

提供你2中思路,具体代码就不写了

生成表的时候给修改链接一个id,id保存当前行的主键比如id="tid"+主键,为它添加onclick方法,

var id=thisidreplace("tid",""); 获取到主键

把主键拿到数据库中查到相应的数据行,赋值给表单,完成!

var parents=$(this)parent()parent();  获得tabel行

$(parents)find("td")each(function(){

根据列的顺序赋值给相应的表单元素

})

这个方法有局限性,数据是从当前页面中取得并不是实时读取数据库,如果数据在他处有更改是取不到最新的数据的。

可以选择所有相同class的元素,然后使用其length属性:

var $elements = $('className');

var len = $elementslength;

alert('有 ' + len + ' 个相同class');

$elementseach(function() {

var $this = $(this);

alert($thisprop('tagName'));

});

1、首先我们打开电脑里的jquery软件创建一个名称为get的html文件。

2、在页面中加入一个div,div内放入文本并加入一些标记,还有两个button在点击不同的button的时候获取不同的内容。

3、然后我们引入jquery库。

4、在文档准备函数中加入button1点击事件,在点击事件后获取div中的text内容。

5、在文档准备函数中加入button2点击事件,在点击事件后获取div中的html内容。

6、在浏览器中运行该文件,点击两个button即可获取不同的结果。

最简单的办法:

<script type="text/javascript">

if (localStoragepagecount){    localStoragepagecount=Number(localStoragepagecount) +1;}else{    localStoragepagecount=1;}documentwrite("访问数: " + localStoragepagecount + " time(s)");</script>Jquery 

jQuery是一套跨浏览器的JavaScript库,简化HTML与JavaScript之间的 *** 作。由John Resig在2006年1月的BarCamp NYC上发布第一个版本。目前是由 Dave Methvin 领导的开发团队进行开发。全球前10000个访问最高的网站中,有59%使用了jQuery,是目前最受欢迎的JavaScript库。

简要介绍

jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team,包括来自德国的J&ouml;rn Zaefferer,罗马尼亚的Stefan Petre等等。jQuery是继prototype之后又一个优秀的Javascrīpt框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。

由于目前高校基本尚未开JavaScript的相关课程,目前jQuery的学习,使用,研究都仅限于在职Web程序员之间。

用jq的前提,首先要引用一个有jq的文件

lt;script type="text/javascript" src=">

这个是jquery官方最新的地址。可用在自己网站里加个这个,就能使用jquery了。 但仍然建议下载到本地服务器上。

特点

动态特效

AJAX

通过插件来扩展

方便的工具 - 例如浏览器版本判断

渐进增强

链式调用

多浏览器支持,支持Internet Explorer60+、Opera90+、Firefox2+、Safari20+、Chrome10+(在200中取消了对Internet Explorer6,7,8的支持)

工厂函数

在编写js库代码时候,你一定经常和“$”美元符号打交道吧?无论prototype还是DWR都使用了$代替频繁的documentgetElementById() *** 作。jQuery也这样做了,但是,它的功能远非如此,瞧瞧以下的jQuery代码,你就会发现它的美丽:

代码

var someElement = $("#myId");

看起来比其他两个框架的要多了一个#,好,看看下面的用法:

代码

$("div p"); // (1)

$("divcontainer"); // (2)

$("div #msg"); // (3)

$("table a",context); // (4)

在prototype里看过这样的写法吗?第一行代码得到所有div标签下的p元素。第二行代码得到class 为container的div元素,第三行代码得到标签下面id为msg的div元素(不过最好别这样写,因为jQuery需要遍历所有的div元素,对于带id的元素,直接用$("#id"))。第四行代码得到context为上下文的table里面所有的链接元素。

如果你熟悉CSS,你会觉得这些写法很眼熟!对了。正是。看出奥妙了吧。jQuery就是如此强大,你可以轻易地找到DOM中的任何元素,而这也是jQuery设计之初query的真实含义(查询)。

遍历函数

jquery提供了很多遍历的函数,如each(fn),但是使用这些函数的前提是:你使用的对象是jquery对象。使一个Dom对象成为一个jquery对象很简单,通过下面一些方式(只是一部分):

代码

var a = $("#cid");

var b = $("<p>hello</p>");

var c = documentcreateElement("table");

var tb = $(c);

代替标签

这个惯例,也许是除了$()之外,用得最多的地方了。下面一段代码:

$(document)ready(function(){

alert"hello");

});(1)

lt;body "alert'hello');">(2)

lt;body "alert'hello');">这里的alert'hello');要等到页面全部加载完毕才执行,注意是全部加载,包括dom,等其它资源。

而$(document)ready(function(){

alert"hello");

});(1)

当dom加载完就可以执行了。

代码1同时做到表现和逻辑分离。并且可以在不同的js文件中做相同的 *** 作,即$(document)ready (fn)可以在一个页面中重复出现,而不会冲突。基本上Jquery的很多plugin都是利用这个特性,正因为这个特性,多个plugin共同使用起来,在初始化时不会发生冲突。

当使用jquery时,推荐使用代码1。

$(document)ready(function(){fn}); 可以用 $(function(){fn});代替

如:

$(function(){

alert"hello");

});

事件机制

我们大量使用的事件可能就是button的onclick了。以前习惯在input 元素上写 "fn()",使用jquery可以使javascrīpt代码与html代码分离,保持HTML的清洁,还可以很轻松地绑定事件,甚至你可以不知道“事件”这个名词。

代码

$(document)ready(function()

{

$("#clear")click(function(){

alert"i am about to clear the table");

});

$("form[12]")submit(validate);

});

function validate(){

//do some form validation

}

实现

代码

$("selector")load(url,data,function(response,status,xhr))

该方法是最简单的从服务器获取数据的方法。它几乎与 $get(url, data, success) 等价,不同的是它不是全局函数,并且它拥有隐式的回调函数。当侦测到成功的响应时(比如,当 textStatus 为 "success" 或 "notmodified" 时),load() 将匹配元素的 HTML 内容设置为返回的数据。这意味着该方法的大多数使用会非常简单。

渐入淡出

代码

$("#msg")show("fast");

$("#msg")hide("slow");

$("#msg")fadeIn();

$("#msg")fadeOut();

没错,上面两行代码已经分别实现了一个id为Msg的jquery对象的渐入和淡出。做一个像Gmail一样的动态加载通知条,用jquery就那么简单。两个函数接受的参数除了快慢等,还可以接收整型,作为渐入或淡出的完成时间,单位为MS。

首先下载好jquery,这里使用的是321版本;

<!-- 新建一个简单的表格,这里2 2的表格 -->

<table border="1" id="table">

<tr>

<td>Tom</td><td>Bibu</td>

</tr>

<tr>

<td>Hello</td><td>Test</td>

</tr>

</table>

第一种:直接获取table 总td的值。

$("table")each(function(){  // 获取表格table中,第几个td的文本

var t1 =$(this)find('td')eq(2)text();

alert(t1);

})

第二种:获取在页面上点击对应的表格获取点击的值

//点击id = table 中选中的值获取选中的值

$("#table td")click(function(){

alert($(this)text());

});

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。

以上就是关于jquery如何获取取元素序号,例如一个有N行的table,点击其中的一行,获取到它的行号。全部的内容,包括:jquery如何获取取元素序号,例如一个有N行的table,点击其中的一行,获取到它的行号。、JQ怎么获取某个DIV上方某个元素 假如是这样的、jquery中如何获取表格的值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9436813.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-28
下一篇 2023-04-28

发表评论

登录后才能评论

评论列表(0条)

保存