ng-click得到当前元素,
直接上代码:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="../plugins/jquery/jquery.js"></script>
<script src="../plugins/angular/angular.js"></script>
</head>
<body ng-app="AngularApp">
<div ng-controller="TestCtrl">
<a href data="1" ng-click="GoPage($event.target)">1</a>
<a href data="2" ng-click="GoPage($event.target)">2</a>
<a href data="3" ng-click="GoPage($event.target)">3</a>
<a href data="4" ng-click="GoPage($event.target)">4</a>
<a href data="5" ng-click="GoPage($event.target)">5</a>
{{ page }}
</div>
<script>
var _app=angular.module("AngularApp",[]);
function TestCtrl($scope) {
$scope.page = 1;
$scope.getData = function () {
console.log($scope.page);
}
$scope.GoPage = function (target) {
$scope.page = target.getAttribute('data');
this.getData();
}
}
_app.controller("TestCtrl",TestCtrl);
</script>
</body>
</html>
其中:target获取到的是点击对象的html字符串,可以通过jquery中$(target)这种形式将字符串转换为dom对象。然后就可以随意进行操作啦。
ng-click得到当前元素,的更多相关文章
- 【jQuery 区别】.click()和$(document).on("click","指定的元素",function(){});的区别
给出以下的代码展示: //绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label ...
- $("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)
//绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous' ...
- ng指令控制一个元素的影藏的与显示几种方法的使用
在ng中我们控制一个元素的显示与隐藏的方法: (1):ng-show=true/false 解释:ng-show使用的是display="block"/"none&quo ...
- 给DOM元素绑定click事件也有学问
最简单的莫过于使用click方法: 1 <input id="btn" type="button" value="BUTTON" on ...
- google跟踪代码管理器gtm无法给相同class元素绑定click事件埋点解决
Google 跟踪代码管理器是一个跟踪代码管理系统 (TMS),可以帮助您快速轻松地更新网站或移动应用上的跟踪代码及相关代码段(统称为“代码”).将一小段跟踪代码管理器代码添加到项目后,您可以通过网页 ...
- 关于click和submit的笔记
click主要用于元素的点击时的响应事件,而submit是指表单元素form的提交事件. 但是,当click加入到表单的提交按钮时,事情似乎就有点复杂,总是忘记了.这两天搜了下,又实践了一下. 主要用 ...
- 移动端的传统click事件延迟和点透现象
一.场景描述: 1.A/B两个层上下z轴重叠. 2.上层的A点击后消失或移开.(这一点很重要) 3.B元素本身有默认click事件(如a标签) 或 B绑定了click事件. 在以上情况下,点击A/B重 ...
- Appium学习路—Android定位元素与操作
一.常用识别元素的工具 uiautomator:Android SDK自带的一个工具,在tools目录下 monitor:Android SDK自带的一个工具,在tools目录下 Appium Ins ...
- 使用protractor操作页面元素
Protractor是为Angular JS应用量身打造的端到端测试框架.它可以真实的驱动浏览器,自动完成对web应用的测试.Protractor驱动浏览器使用的是WebDriver标准,所以使用起来 ...
- $("").click与onclick的区别示例介绍
Html代码: <script type="text/javascript"> $(function(){ $("#btn4").click(fun ...
随机推荐
- js Date操作
new Date(new Date().getTime() - 24 * 24 * 60 * 60 * 1000)类似C#中的AddDays,返回一个月前的时间 //时间格式化方法 v ...
- iOS conformsToProtocol
- (BOOL)conformsToProtocol:(Protocol *)aProtocol; 是用来检查对象(包括其祖先)是否实现了指定协议类的方法. 今天遇到一个问题,一个类没有实现proto ...
- 《Start Developing iOS Apps Today》摘抄
原文:<Start Developing iOS Apps Today> Review the Source Code 入口函数main.m #import <UIKit/UIKit ...
- 51、自定义View基础和原理
一.编写自己的自定义View最简单的自定义View,继承View通过覆盖View的onDraw方法来实现自主显示利用Canvas和paint来绘制显示元素(文字,几何图形等) <com.myvi ...
- Win10下Hyper-V设置网络连接
具体方法如下. 1.点击虚拟交换机管理 2.创建虚拟交换机 选择内部 3.选择链接类型
- 【BZOJ4566】[Haoi2016]找相同字符 后缀数组+单调栈
[BZOJ4566][Haoi2016]找相同字符 Description 给定两个字符串,求出在两个字符串中各取出一个子串使得这两个子串相同的方案数.两个方案不同当且仅当这两 个子串中有一个位置不同 ...
- 170117、spring解决乱码
spring解决乱码这个问题网上有很多解决方法,也可以关注本博客的文章,在此不再赘述, 今天推荐大家另外两种解决方法! 问题现象: 1.后台代码 2.前端界面 解决方法: 方法1:是在后台请求方法上加 ...
- ZOJ 3331 Process the Tasks(双塔DP)
Process the Tasks Time Limit: 1 Second Memory Limit: 32768 KB There are two machines A and B. T ...
- c# ,socket编程的一些常用方法
1 命名空间 需要添加的命名空间 using System.Net; using System.Net.Socket; 2 构造新的socket对象 socket原型: public socket ( ...
- Java基础语法 - 面向对象 - this 关键字
在Java语言中规定使用this关键字来代表本类对象的引用,this关键字被隐式地用于引用对象的成员变量和方法. this关键字引用的就是本类的一个对象,在局部变量或方法参数覆盖了成员变量时,就要添加 ...