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 ...
随机推荐
- combox使用要点
<select id="node_type" name="node_type" class="easyui-combobox" req ...
- MySQL服务停止,无法启动了~
怎么解决mysql服务无法启动的问题
- 优化phpstorm运行卡顿问题
在PHPSTORM中点击导航菜单:Help -> Edit Custom VM Options 如果是第一次点击,会提示是否新建配置文件,点击“yse” 在弹出的编辑框末尾加上以下配置 -Daw ...
- CentOS 7安装与配置jdk-8u162
一.下载jdk-8u162版本 jdk-8u162-linux-x64.rpm 二.上传jdk到centos下 上传完后的文件如下,文件只有读写权限,没有执行权限 使用如下命令授权,如果文件已经有了执 ...
- iOS开源库–最全的整理
本文转载至 http://www.code4blog.com/archives/505 youtube下载神器:https://github.com/rg3/youtube-dl我擦咧vim插件:ht ...
- 苹果 App Store 申请和管理相关知识
本文转载至 http://blog.csdn.net/yu0089/article/details/8027669 app store为开发者提供四种类型的申请: 个人ios开发者计划$99/年 公司 ...
- 52、图片缩放库 PhotoView
PhotoView的简介: 这是一个图片查看库,实现图片浏览功能,支持pinch(捏合)手势或者点击放大缩小.支持在ViewPager中翻页浏览图片. PhotoView 是一款扩展自Android ...
- group_concat 多对多关联, 统计分组数据, 结果拼接到一个字段
统计用户所有的角色, 结果: 1 张三 普通用户,管理员,XXX 2 李四 普通用户, XXX select ur.user_id,u.login_name,GROUP_CONCAT ...
- link options and how g++ is invoked gcc g++
yum install gcc yum install gcc-c++ yum reinstall gcc gcc-c++ Downloading packages:(1/2): gcc-c++-4. ...
- 编译Elasticsearch源码
1.从github上clone es的源码 git clone https://github.com/elastic/elasticsearch.git 2.如果没有安装gradle的话,需要安装g ...