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

题目是这样的，如果一个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. ACM学习历程—HDU1023 Train Problem II（递推 && 大数）

    Description As we all know the Train Problem I, the boss of the Ignatius Train Station want to know  ...

  2. 【LeetCode】019. Remove Nth Node From End of List

    Given a linked list, remove the nth node from the end of list and return its head. For example, Give ...

  3. 移植memtester到android平台

    硬件搭建起来能进入系统,首要就是测试内存的稳定性,需要一款内存测试工具. 一般都是选择memtester这款linux软件,下载地址如下:http://pyropus.ca/software/memt ...

  4. 用遗传算法解决TSP问题

    浅谈遗传算法:https://www.cnblogs.com/AKMer/p/9479890.html Description \(小m\)在踏上寻找\(小o\)的路程之后不小心碰到了大魔王\(fat ...

  5. 【转】 Pro Android学习笔记（五八）：Preferences（2）：CheckBoxPreference

    目录(?)[-] CheckBox Preference xml文件 设备的存贮文件 复合preference 在ListPreference的例子中显示的是单选,如果是多选,可采用CheckBoxP ...

  6. 【转】 Pro Android学习笔记（三二）：Menu（3）：Context菜单

    目录(?)[-] 什么是Context menu 注册View带有Context menu 填Context菜单内容 Context菜单点击触发 什么是Context menu 在桌面电脑,我们都很熟 ...

  7. tomcat如何修改发布目录

    tomcat免重启 tomcat访问的时候如何去掉项目名访问: 其中fts是您的项目名. 1.tomcat6.0:<Host></Host>间加了一句<Context p ...

  8. java 正则表达式 验证邮箱

    import java.util.regex.Matcher; import java.util.regex.Pattern; public class demo1 { /**java正则表达式 * ...

  9. wdcp安全设置,让你的后台,只有你自己能访问

    wdcp安全设置,让你的后台,只有你自己能访问 wdcp的后台,默认端口,是8080,可以修改为其它端口wdcp的后台,可以限制IP地址的访问,也可以限制域名的访问做了这些限制与设置后,已相对安全了, ...

  10. SQL标量值函数：返回汉字拼音首拼

    今天遇到一个需求,客户要求在系统客户端选择客户的时候,可以用拼音首拼去快速过滤选择,此时我们在客户表里面加多一个拼音首拼字段CustPY来记录,字段加好了,我们要把所有客户名称的拼音简拼都更新到Cus ...