jquery 怎么获取当前点击class 是第几个

jquery 怎么获取当前点击class 是第几个,第1张

一、如果是同级(兄弟元素)的,如:

<ul><li class='a'></li><li class='a'></li></ul>可以

$("a")click(function(){

var a=$(this)index;

//或者

var a=$('a')index(this);

}

二、而对于不同级(非兄弟元素),如:

<div class='a'></div>

<div><div class='a'></div></div>

则只能这样

$("a")click(function(){

var a=$('a')index(this);

}

扩展资料:

注意事项

jQuery 拥有若干进行 CSS *** 作的方法。

1、addClass() - 向被选元素添加一个或多个

2、removeClass() - 从被选元素删除一个或多个类

3、toggleClass() - 对被选元素进行添加/删除类的切换 *** 作

4、css() - 设置或返回样式属性

例如:

important

{

font-weight:bold;

font-size:xx-large;

}

blue

{

color:blue;

}

向不同的元素添加 class 属性。当然,在添加类时,也可以选取多个元素:

实例:

$("button")click(function(){

$("h1,h2,p")addClass("blue");

$("div")addClass("important");

});

JQuery通过类选择器捕获click事件获取当前点击对象的id的实例代码:

<script>

$(function () {

$("test")click(function () {

var val=$(this)attr("id");

alert(val);

})

})

</script>

</head>

<body>

<a id="user" class="test" href="#">User</a>

</body>

扩展资料:

JQuery通过ID选择器捕获click事件获取当前点击对象的id的实例代码:

<script>

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

var val=$(this)attr("name");

alert(val);

})

</script>

</head>

<body>

<a id="student" name="Tom" href="#">Student</a>

</body>

JQuery通过元素选择器捕获click事件获取当前点击对象的id的实例代码:

<script>

$("input")click(function () {

var val=$(this)val();

alert(val)

})

</script>

</head>

<body>

<input id="btn" type="button" name="ok" value="Hello" />

</body>

$(document)ready(function(){

$("li")children()click(function(){//当li下的子元素被点击时触发

alert('点击了li下的'+$(this)[0]tagName);//获取被点击元素的标签

});

});

和js差不多的,比如说你单击一个input,那么代码就是$(document)ready(function(){$("input")click(function(){var id=thisid;//input的ID});});

jquery中获取当前元素的索引,用index(this) 方法:

举例:

$("li")hover(function(){

alert($("li")index(this)); //打印当前li的位置

});

以上就是关于jquery 怎么获取当前点击class 是第几个全部的内容,包括:jquery 怎么获取当前点击class 是第几个、JQuery通过类选择器捕获click事件获取当前点击对象的id、jquery如何判断所点击元素是哪个等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

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

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

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

发表评论

登录后才能评论

评论列表(0条)

保存