jquery移除、绑定、触发元素事件使用示例详解
字体：[ ] 类型：转载 时间：
这篇文章主要介绍了jquery移除、绑定、触发元素事件使用示例详解,需要的朋友可以参考下
代码如下:unbind(type [,data])&&&& //data是要移除的函数$('#btn').unbind("click"); //移除click$('#btn').unbind(); //移除所有
对于只需要触发一次的，随后就要立即解除绑定的情况，用one() 代码如下:$('#btn').one("click",function(){.......});
触发操作trigger() 方法触发被选元素的指定事件类型。
代码如下:$('#btn').trigger("click");
也可以直接执行事件 代码如下:$('#btn').click();
触发自定义事件bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。 代码如下:$('#btn').bind("myclick",function(){....});
模拟触发上面的绑定函数 代码如下:$('#btn').trigger("myclick");
传递数据trigger(event,[param1,param2,...]) 代码如下:$('#btn').bind("myclick",function(event,message1,message2){...........});$('#btn').trigger("myclick",["传给message1","传给message2"]);
触发执行默认操作 代码如下:$("input").trigger("focus");//不仅会触发input元素绑定的focus事件，还会触发默认操作——得到焦点
只触发绑定事件，不执行浏览器默认操作 代码如下:$("input").triggerHandler("focus");//只触发绑定事件，不执行浏览器默认操作
绑定多个事件类型 代码如下:$("div").bind("mouseover mouseout",function(){.....});
添加事件命名空间 代码如下:$("div").bind("click.plugin",function(){......});
在所绑定的世界类型后面添加命名空间，这样在删除事件时只需要指定命名空间即可。 代码如下:$("div").unbind(".plugin");&& //删除空间内的事件$("div").trigger("click!"); //触发所以不包含在命名空间中的click方法
如果包含在命名空间的也要触发 代码如下:$(“div”).trigger(“click”);
取消或者绑定函数 代码如下:$('div').bind('click', RecommandProduct);//为div绑定RecommandProduct 函数$('div').unbind('click', RecommandProduct);//取消RecommandProduct 函数
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具Posts - 270,
Articles - 0,
Comments - 2024
23:29 by 破狼, ... 阅读,
这其实是一个很简单的问题，如果你认真查看过Angular官方的API文档，本来不想记录的。但是这个问题不止一次的被人问起，所以今天在记录在这里。
在Angular中已经对一些ng事件如ngClick,ngBlur,ngCopy,ngCut,ngDblclick&中加入了一个变量叫做$event.
如ngClick在官方文档是这么描述的：
Expression to evaluate upon click. (Event object is available as $event)
在查看Angular代码:
var ngEventDirectives = {};
'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave keydown keyup keypress submit focus blur copy cut paste'.split(' '),
function(name) {
var directiveName = directiveNormalize('ng-' + name);
ngEventDirectives[directiveName] = ['$parse', function($parse) {
compile: function($element, attr) {
var fn = $parse(attr[directiveName]);
return function(scope, element, attr) {
element.on(lowercase(name), function(event) {
scope.$apply(function() {
fn(scope, {$event:event});
在上边代码我们可以得到两个信息：
Angular支持的event： click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave keydown keyup keypress submit focus blur copy cut paste
Angular在执行事件函数时候传入了一个名叫$event的常量，该常量即代表当前event对象，如果你在Angular之前引入了jQuery那么这就是jQuery的event.
所以我们可以利用event的stopPropagation来阻止事件的冒泡：如下代码：
html 代码:
&!DOCTYPE html&
&html id="ng-app" ng-app="app"&
&script src="/ajax/libs/angularjs/1.1.5/angular.min.js"&&/script&
&meta charset="utf-8"&
&title&JS Bin&/title&
&body ng-controller="demo as d"&
&div ng-click="d.click('parent',$event)"&
given some text for click
&input type="checkbox" ng-model="d.stopPropagation" /&Stop Propagation ?
&button type="button" ng-click="d.click('button',$event)"&button&/button&
angular.module("app",[])
.controller("demo",[function(){
var vm = this;
vm.click = function(name,$event){
console.log(name +" -----called");
if(vm.stopPropagation){
$event.stopPropagation();
可以在jsbin]()查看效果。
首先打开你的控制台，然在没选中Stop Propagation的情况下点击button你将会看见两条log记录，相反选中后则只会出现button的log信息。
希望大家已经明白了，不要再问这类问题了。angularjs绑定
ng-click问题 - 跟谁学
搜索你想学的科目、老师试试，例如“数学”搜索吉安
&&angularjs绑定
ng-click问题我在服务中提供了一个数组供页面repeat 其中的click是我想给每个按钮加的事件 我在按钮上这样遍历 为什么会提示错误 之前在做移动端的时候也是这样做的，但没有出现这样的问题oceania此刻最好
给个一般的解决方案，首先你在控制器中定义一个函数：function btnAction(flag) {
if('add' === flag) {
else if('delete' === flag) {
...}你给循环的每一项添加一个相同的函数就是btnAction()，然后给这个函数传递不同的参数flag，然后根据不同的参数，做出不同的判断。当然参数也可以循环的每一项的$index。刚才想了一下，如果你确实想使用这种办法的话，也不是没有解决方法，可以使用angular的$scope.$eval([expression], [locals]);，这个方法的作用就是在当前作用域内，运行expression表达式，并把这个表达式的结果返回。因为的你这些函数还有那个循环的数组是写在服务中的，并且你使用了controllerAs语法，所以要在控制器中添加对那些函数的引用，大概是下面这个样子的。JavaScript:(function() {
angular.module('MyApp', [])
.service('MyService', MyService)
.controller('MainController', MainController);
MyService.$inject = [];
MainController.$inject = ['MyService', '$scope'];
function MyService() {
var service = {
function add() {
alert('add action!');
function del() {
alert('del action!');
function MainController(MyService, $scope) {
vm.myApply = myA
vm.ctrlClick = ctrlC
vm.add = MyService.
vm.del = MyService.
vm.items = [
{name: '控制器中的', click: 'vm.ctrlClick()'},
{name: '添加', click: 'vm.add()'},
{name: '删除', click: 'vm.del()'}
function myApply(expr, locals) {
return $scope.$eval(expr, locals);
function ctrlClick() {
}})();HTML:&div ng-app="MyApp"&
&div ng-controller="MainController as vm"&
&li ng-repeat="v in vm.items"&
&button ng-click="vm.myApply(v.click, v)"&{{v.name}}&/button&
&/div&&/div&这样子应该可以喽。
把 button 上面 ng-lcick="{{btn.click}}" 里面的 {{ 和 }} 去掉试试
这样写怪怪的，也许是你换了Angular版本，然后angular为了安全原因不允许你这样做了。从理论上来说，ng-click里的内容只能是Angular表达式，{{}}这样的东西只能当做模板来用。建议你直接在toolButtons中click属性直接引用函数 例如：var toolButtons = [
{name: '添加', icon:'icon-zengjia', class:'col-xs-1', click: $scope.FormDesign.addClick} ];然后在html中&button type="button" ng-repeat="btn in FormDesign.toolButtons" ng-click="btn.click()"&
个人建议不要写那么多的函数
直接调用同一个函数
然后使用$index作为参数传入来区分或者使用repeat的当前对象来区分
类似于楼上所说的将V作参数传入
相关问题大家都在看最新提问
关注我们官方微信关于跟谁学服务支持帮助中心