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

题目是这样的，如果一个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. freeMarker（十一）——模板语言之指令

    学习笔记,选自freeMarker中文文档,译自 Email: ddekany at users.sourceforge.net 1.assign 概要 <#assign name1=value ...

  2. Agc019_F Yes or No

    传送门 题目大意 有若干道判断题,其中有$n$道答案是$Yes$,另外$m$道答案是$No$,问题除了答案差异本质相同.这些题一道都不会做,但是事先知道$n$和$m$的数量.每次机器会事先等概率地排列 ...

  3. codeforces914G Sum the Fibonacci

    题目大意:给定一个长为$n$($n\leq 10^6$)的序列S,定义一个合法的五元组$(a,b,c,d,e)$合法当且仅当 $$ ( S_a \mid S_b ) and S_c and ( S_d ...

  4. Java 处理批量数据提交

    在Java web开发过程中,处理表单数据是很重要一部分,常见的是form post处理单条数据的,但也会遇到一次提交多条数据到服务器的,如下:

  5. 【算法总结】Manacher's Algorithm

    Manacher's Algorithm针对的是最长回文子串问题.对于此问题,最直接的方法是遍历每一个元素,遍历过程中以每一个字符为中心向两边扩展以寻找此字符为中心的最长回文子串.复杂度O(n2).M ...

  6. HUD1455:Sticks

    Sticks Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...

  7. MySQL(介绍1)

    数据库(Database)是按照数据结构来组织.存储和管理数据的仓库: 也可以将数据存储在文件中,但是在文件中读写数据速度相对较慢. 在WEB应用方面MySQL是最好的RDBMS(Relational ...

  8. Spring 3.x 企业引用开发实战（陈雄华/林开雄）

    目录 ... 第一章:Spring概述 IoC:BeanFactory.Context.El(SpringEL表达式) AOP:允许JVM虚拟机启动时使用代理类在运行时期修改指定类的字节码,改变一个类 ...

  9. (转)JAVA中的权限修饰符

    注:本博文是转载的,原文地址:http://blog.csdn.net/xk632172748/article/details/51755438 Java中修饰符总结: 访问控制修饰符 访问控制修饰符 ...

  10. robot framework结合Jenkins（一）

    一.CI与Jenkins介绍: 1.持续集成(CI) 持续集成是一种软件开发实践,即团队开发成员经常集成他们的工作,通过每个成员每天至少集成一次,也就意味着每天可能会发生多次集成.每次集成都通过自动化 ...