面试中遇到的问题,前两天一直没有解决,今天想想还是得要想办法才行,其实仔细想的话很简单,惭愧啊,面试的时候没有做出来!

题目是这样的,如果一个body中有5个a标签,当我们点击对应的a标签时,alert出相应的第几个元素,如点击第一个a标签时返回1,点击第二个a标签时返回2,以此类推.....

今天写的实现代码,静下心来想其实还是蛮简单的:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>点击对应的a标签给出相应的数字</title>
<script type="text/javascript" src = "jquery-1.8.1.js"></script>
</head>
<body>
<a href="#">点击</a>
<a href="#">点击</a>
<a href="#">点击</a>
<a href="#">点击</a>
<a href="#">点击</a>
<script type="text/javascript">
(function(){
$("a").click(function(){
var position = $("a").index(this);
alert(position+1);
});
})()
</script>
</body>
</html>

效果:

点击对应的a标签返回相应的第几个的更多相关文章

  1. jeecg 弹出框 点击按钮回调父页面 返回值

    jeecg 弹出框 点击按钮回调父页面 返回值 <t:base type="jquery"></t:base> <t:base type=" ...

  2. 点击事件获得li标签内容

    通过点击事件获得li标签内容 Table of contents 随笔 随笔 <li onclick="liClick(this)">数据</li> //点 ...

  3. vue打包成app后,点击手机上的物理返回按钮后直接退出app

    在浏览器上浏览vue项目时,后退按钮是可以正常返回上一页的,但是打包成app后,点击手机上的屋里返回按钮,就直接退出app回到桌面了, 以下是解决办法: 使用mui进行手机的物理键的监听 1.首先安装 ...

  4. jq再次封装自己的ajax & js 回调函数 & js方法注释&js 全局屏蔽点击事件及a标签

    1.封装成一个独立JS var commonUrl = 'http://xx.xxx.com/'; function http({ url, type = "post", data ...

  5. 解决点击a标签返回页面顶部的问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. (转)解决点击a标签返回页面顶部的问题

    本文转载至http://www.cnblogs.com/chenluomenggongzi/p/5950670.html 1 <!DOCTYPE html> 2 <html lang ...

  7. 解决点击空<a>标签返回页面顶部的问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. ThinkPHP框架下,给jq动态添加的标签添加点击事件移除标签

    jq移除标签主要就是$("#要移除的id").remove();不再赘述,这里要提醒的是jq中动态添加标签后怎样添加点击事件.一般的jq添加点击事件是用这种方法$("#i ...

  9. jquery click()方法模拟点击事件对a标签不生效的解决办法

    阅读数:8971 <a href="www.baidu.com"></a> 1 问题分析 点击A标签本身,并不会触发跳转到指定链接的事件,就是说,我们平时都 ...

随机推荐

  1. 【遍历二叉树】03二叉树的后序遍历【Binary Tree Postorder Traversal】

    ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 给定一个二叉树,返回他的后序遍历的 ...

  2. CodeForces Gym 100228 Graph of Inversions

    题目大意 对于一个长为$N$的序列$A$,定义它所对应的逆序图: 有$N$个点组成,标号为$1...N$的无向图,对于每一组$i,j(i<j)$若存在$A_i>A_j$则在新图中就存在一条 ...

  3. 2017-2018-1 20179215《Linux内核原理与分析》第五周作业

    一.视频学习 1.系统调用的三层皮:xyz(API).system call(中断向量).sys_xyz(不同种类的服务程序). 2.Libc库定义个一些API引用了封装例程(wrapper rout ...

  4. ACM学习历程—HDU 5012 Dice(ACM西安网赛)(bfs)

    Problem Description There are 2 special dices on the table. On each face of the dice, a distinct num ...

  5. 霍夫变换Hough

    http://blog.csdn.net/sudohello/article/details/51335237 霍夫变换Hough 霍夫变换(Hough)是一个非常重要的检测间断点边界形状的方法.它通 ...

  6. Poj1298_The Hardest Problem Ever(水题)

    一.Description Julius Caesar lived in a time of danger and intrigue. The hardest situation Caesar eve ...

  7. Python-连接Redis并操作

    首先开启redis的外连 sch01ar@ubuntu:~$ sudo vim /etc/redis/redis.conf 把bind 127.0.0.1这行注释掉 然后重启redis sudo /e ...

  8. tar 排除某个目录

    tar -zcvf tomcat.tar.gz --exclude=tomcat/logs --exclude=tomcat/libs tomcat

  9. Linux下UDP发送大量请求导致Operation not permitted的问题探讨

    一.问题背景目前公司准备上微服务的架构模式,在对比大量的API网关之后,最后选中了Kong作为我们的API网关,在经过大量的研究之后,啊呸,踩坑之后,终于跑起来了,简直是普天同庆,撒花祝贺. 但是在美 ...

  10. 汉字转为unicode

    在word中输入“立项申请阶段”,将光标移到每字之后时按下组合键Alt+X. 立项申请阶段 7ACB  9879  7533  8BF7  9636  6BB5 \u7ACB\u9879\u7533\ ...