zoukankan      html  css  js  c++  java
  • jQuery动态绑定生成的元素

    有一次课程上,一个html里面有一个li,然后根据条件生成了若干个平行的li,后来需要给li添加点击事件,但是通过

    $('li').click(fn)
    

      绑定并没有成功,结果是只有静态页面里面有的那个li能起作用,原因是通过ajax异步请求生成的元素完成的时间是未知的,在绑定点击事件的时候有可能异步数据还没有返回,所以事件失效.

    解决办法(二选一):

    将ajax请求的async属性设置为false;

    动态绑定未知元素的方法

    $(document).on('click','#a1',fn)/*给已有的或将来会出现的document下的id为a1的元素绑定点击事件,回调fn*/
    $('#a1').on('click',fn)/*简写*/

     下面就是一个例子:

    给通过ajax请求动态生成的id为'book_list'的元素下的li元素绑定点击事件(通常使用动态绑定元素方法而不将ajax设置为同步)

    $('#book_list').on('click','li',function(){
    	$('#note_list').empty();
    	/*每个笔记本绑定的笔记本id*/
    	var notebook_id=$(this).data('notebook_id');
    	alert(notebook_id);
    	$.ajax({
    		url:'/note/note/list.do',
    		type:'post',
    		data:{'notebookId':notebook_id},
    		dataType:'json',
    		success:function(result){
    			for(var i=0;i<result.length;i++){
    				//code
    			}
    		},
    		error:function(result){
    			//code
    		}
    	});
    });
    

      

    如果需要参数传递:

       比如,需要在加载的页面中的文本框里设置值,如果在load完成了之后设置是实现不了的,要通过$.load(url,data,function(){setPrams})在回调函数里设置,意为加载完成了回调此函数设置

  • 相关阅读:
    有道翻译爬虫
    设置Ubuntu默认root密码
    搭建内部PyPi源
    Python上下文管理器with 学习笔记
    Mysql5.7 绿色版安装
    Mardown 格式接口模板
    Winrar去广告
    Python 查询第三方包依赖及下载
    Python 捕获redis异常
    react入门系列之使用 antd, react, redux,creat-react-app搭建todo-list升级版本
  • 原文地址:https://www.cnblogs.com/jamsbwo/p/4881018.html
Copyright © 2011-2022 走看看