jQuery绑定下拉菜单onchange事件的问题,用到了闭包-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

jQuery绑定下拉菜单onchange事件的问题,用到了闭包

2016-03-25 14:21:46 2767 1

首先有一个select控件:

<div id="courseDiv">
    <select id="isAlready">
        <option value="already">已选</option>
        <option value="notYet">未选</option>
    </select>
    <!-- 其他的代码忽略... -->
</div>

在下面的方法里为控件绑定onchange事件的处理函数:

function showCourseDiv(studentId) {
    //用了flexigrid控件,与问题无关,可以忽略之
    $("#courseFlexGrid").flexOptions({
        newp : 1,
        addparams : [{
            name : "studentId",
            value : studentId   
        }]
    }).flexReload();
    //这里绑定的事件方法!
    $("#isAlready").change(function() {
        //调用填充flexigrid的方法,使用了闭包
        //searchCourseFlexGrid()的代码就不贴了
        searchCoursesFlexGrid(studentId);
    });
    //显示包含select控件的div,自己封装的
    //与问题无关,代码忽略了
    showCustomDiv(true, 'courseDiv');
}

主要的流程是这样的:
所有学生记录都使用同一个courseDiv来添加/删除课程,点击一个学生的“选课/删课”按钮后,执行showCourseDiv(studentId)方法:显示courseDiv,把学生的已选课程都展示出来,然后绑定onchange事件处理函数searchCoursesFlexGrid(studentId)。在事件函数里,会根据传来的studentId参数和select控件的值,查询对应学生的已选or未选课程。

遇到的问题是这样的:
点击给学生1(假设studentId=1001)的"选课/删课"按钮,这时候会执行showCourseDiv(1001)方法,方法中给select控件onchange事件绑定了searchCoursesFlexGrid(1001)方法,这些都没有问题,下拉菜单的功能都正常。
问题在这里,之后再点击其他学生的“选课/删课”按钮,修改下拉菜单值的时候,每次都会执行searchCoursesFlexGrid(1001),参数永远都是学生1的id。

用firebug断点:
showCourseDiv()方法的参数正常,点击下拉菜单时,searchCoursesFlexGrid()参数一直是1001。

我目前只学了半个月的jQuery,js也非常不熟,这个问题纠结两天了,希望大神们帮忙解决一下 Orz

取消 提交回答
全部回答(1)
  • 小旋风柴进
    2019-07-17 19:14:17

    $("#isAlready").off('change');
    最好设置全局变量current_student_id

    function showCourseDiv(studentId) {
        window.current_student_id = studentId;
    }
    
    $("#isAlready").change(function() {
        searchCoursesFlexGrid();
    });
    
    function searchCoursesFlexGrid()
    {
        var studentId = window.current_student_id;
    }
    0 0
相关问答

1

回答

jquery动态绑定事件问题

2016-02-20 15:54:13 1962浏览量 回答数 1

1

回答

jQuery ajax success()括号里的参数是什么?

2016-06-01 09:12:19 4712浏览量 回答数 1

1

回答

jquery ajax 的$.post()跟$.get()方法有什么区别

2016-07-07 14:20:15 2104浏览量 回答数 1

1

回答

JQuery Ajax + PHP 出现乱码,求解决方法

2016-07-07 14:30:30 2144浏览量 回答数 1

1

回答

jquery ajax 读取json数据存入表格中

2016-07-07 14:45:32 2241浏览量 回答数 1

1

回答

jquery ajax 导入json数据进行修改操作

2016-07-07 15:27:17 3861浏览量 回答数 1

1

回答

使用jQuery ajax,回调函数

2016-07-07 18:31:14 1822浏览量 回答数 1

1

回答

如何更改 jQuery Mobile 的 Ajax 默认提示?

2016-07-08 10:06:20 2275浏览量 回答数 1

1

回答

jquery的ajax好像是无阻塞状态的。

2016-07-08 14:31:53 1459浏览量 回答数 1

1

回答

Jquery如何获取 ajax动态生成的checkbox?

2016-07-11 16:50:48 2049浏览量 回答数 1
文章
问答
问答排行榜
最热
最新
相关课程
更多
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载