jquery中封装函数传递当前元素的方法示例


Posted in jQuery onMay 05, 2017

最近在工作中遇到一个问题,需要对页面上一组元素进行ajax操作,结构如下:

<div id="aid"></div> 

<div id="aid"></div> 

<div id="aid"></div> 

<div id="aid"></div> 

<div id="stop">Stop here</div> 

<div id="aid"></div> 

<div id="aid"></div> 

<div id="aid"></div>

编写遍历函数

function a() {

      $('div').each(function () {

        var that = $(this);

        var id = that.attr('id');

        b(id, that)

      })

    }

首先执行函数 a()  遍历每个元素,然后执行b() 函数进行ajax

function b(aId,that) {

      $.ajax({

        url: 'ajaxHandler.ashx',

        data: { aid: aid },

        dataType: 'text',

        type: 'post',

        async: true,

        success: function (data) {

          var content = '';

          if (data == 'true') {

            content = "正确";

          } else {

            content = "错误";

          }

          that.html(content);

        }

      })

    }

根据返回值 对点击的元素赋予不同的值

因为html元素有部分样式一样,所有没有办法根据 $("#id").html("赋值"); 进行赋值

这儿使用this,将返回值赋予当前点击的元素

因为该页面函数发生嵌套,所以需要传递当前元素,

但由于种种原因,到最后可能很难使用this,仍然取到正确的当前元素,所以,可以使用一个变量来存储this:

var that = $(this);然后在使用就可以了

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

jQuery 相关文章推荐
为Jquery EasyUI 组件加上清除功能的方法(详解)
Apr 13 jQuery
jQuery接受后台传递的List的实例详解
Aug 02 jQuery
jQuery Datatable 多个查询条件自定义提交事件(推荐)
Aug 24 jQuery
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
Sep 20 jQuery
jquery animate动画持续运动的实例
Nov 29 jQuery
jQuery中复合选择器简单用法示例
Mar 31 jQuery
jQuery+ajax实现动态添加表格tr td功能示例
Apr 23 jQuery
jQuery实现的五星点评功能【案例】
Feb 18 jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
jQuery 查找元素操作实例小结
Oct 02 jQuery
jQuery实现查看图片功能
Dec 01 jQuery
jquery插件实现搜索历史
Apr 24 jQuery
jQuery使用JSONP实现跨域获取数据的三种方法详解
May 04 #jQuery
jQuery树插件zTree使用方法详解
May 02 #jQuery
jQuery Tree Multiselect使用详解
May 02 #jQuery
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 #jQuery
jQuery实现按比例缩放图片的方法
Apr 29 #jQuery
jQuery输入框密码的显示隐藏【代码分享】
Apr 29 #jQuery
jQuery实现多张图片上传预览(不经过后端处理)
Apr 29 #jQuery
You might like
oracle资料库函式库
2006/10/09 PHP
简单介绍下 PHP5 中引入的 MYSQLI的用途
2007/03/19 PHP
屏蔽F1~F12的快捷键的js函数
2010/05/06 Javascript
imgAreaSelect 中文文档帮助说明
2011/10/08 Javascript
自己动手手写jQuery插件总结
2015/01/20 Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
2015/02/04 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
2015/08/11 Javascript
使用jQuery的easydrag插件实现可拖动的DIV弹出框
2016/02/19 Javascript
js数组实现权重概率分配
2017/09/12 Javascript
three.js中文文档学习之通过模块导入
2017/11/20 Javascript
JS匿名函数和匿名自执行函数概念与用法分析
2018/03/16 Javascript
vue 1.0 结合animate.css定义动画效果
2018/07/11 Javascript
JS面试题大坑之隐式类型转换实例代码
2018/10/14 Javascript
ES6知识点整理之函数对象参数默认值及其解构应用示例
2019/04/17 Javascript
JS画布动态实现黑客帝国背景效果
2020/11/08 Javascript
解决vue初始化项目一直停在downloading template的问题
2020/11/09 Javascript
python中子类继承父类的__init__方法实例
2016/12/15 Python
python使用suds调用webservice接口的方法
2019/01/03 Python
python Manager 之dict KeyError问题的解决
2019/12/21 Python
Python3+selenium实现cookie免密登录的示例代码
2020/03/18 Python
keras 如何保存最佳的训练模型
2020/05/25 Python
一款利用纯css3实现的超炫3D表单的实例教程
2014/12/01 HTML / CSS
新入职员工的自我介绍演讲稿
2014/01/02 职场文书
九年级政治教学反思
2014/02/06 职场文书
2014党委书记四风对照检查材料思想汇报
2014/09/21 职场文书
2014年学生会部门工作总结
2014/11/07 职场文书
开平碉楼导游词
2015/02/06 职场文书
导师工作推荐信
2015/03/27 职场文书
房地产项目合作意向书
2015/05/08 职场文书
奖励申请报告范文
2015/05/15 职场文书
沂蒙六姐妹观后感
2015/06/08 职场文书
祝福语集锦:给百岁老人祝寿贺词
2019/11/19 职场文书
基于flask实现五子棋小游戏
2021/05/25 Python
你知道Java Spring的两种事务吗
2022/03/16 Java/Android
Python批量解压&压缩文件夹的示例代码
2022/04/04 Python
box-shadow单边阴影的实现
2023/05/21 HTML / CSS