angularJS框架中循环生成的html片段jquery无法获取到节点

本文介绍如何使用AngularJS的ng-repeat指令结合ng-mouseover事件实现图片切换效果。通过自定义函数changeImg($event),可以捕捉鼠标悬停事件并获取当前图片的源地址,再将该地址应用于另一图片元素中实现显示效果更新。

通过ng的定义函数和$event来获取相应的数据

<li data-ng-repeat="img in imgs" >
    <img ng-src="{{img}}" ng-mouseover=changeImg($event) class="img-list-img">
</li>
$scope.changeImg = function (ev) {
    //通过$event获取节点,得到src
    //console.log(ev.target.src);
    $scope.firstImg = ev.target.src;
};
通过上述获取到当前触发函数的节点数据。放置到相应需要的地方

<img ng-src="{{firstImg}}" alt="">
来代替data-ng-repeat之后无法通过$(".className")获取的办法。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值