layui 监听checkbox,checkbox全选,反选,日期使用,select赋值,图片预览上传

1、checkbox 使用
	form.render('checkbox') //再次渲染,不能选的时候需要再次渲染使用
2、全选,反选
	form.on('checkbox(product_checkbox_all)', function (data) {
       if( data.elem.checked) {//判断选中
	      //全选
          $("input[name='article[]']").each(function () {
             this.checked = data.elem.checked;
          });
       }else{
	      //反选
          $("input[name='article[]']").each(function () {
             this.checked = false;
          });
       }
	   form.render('checkbox'); //刷新
     });
3、 日期
	 //日期插件
	 laydate.render({
        elem: '#start_time',
        type:'datetime', // 可选择:年、月、日、时、分、秒
        format: 'yyyy-MM-dd HH:mm:ss', //指定时间格式
     });
4、select
	 //select赋值
	 $("#city").val(2)
     form.render('select') //再次渲染
5、图片预览上传
	 //图像显示
     upload.render({
        elem:'.uploadImg'
        ,url:''
        ,accept:'file'  // 允许上传的文件类型
        ,method: 'POST'
        ,data:{
            '_token':'{{csrf_token()}}'
        }
        ,auto:true // 自动上传
        ,before:function (obj) {
            // 预览
            obj.preview(function(index,file,result) {
                // console.log(file.name);    //图片地址
                // console.log(file.type);    //图片格式
                // console.log(file.size);    //图片大小
                // console.log(file);    //图片地址
                $('.pro_thumb').attr('src',result); //图片链接 base64
            });
        }
        // 上传成功回调
        ,done:function(res) {
            // console.log(upload);
            console.log(res);
            layer.msg(res.msg);
            if (res.status == 'success') {
                $('.pro_thumb_val').val(res.thumb)
                $('.pro_delImg').show()
            }
        }
        // 上传失败回调
        ,error:function(index,upload) {
            // 上传失败
        }
    });
	
	//如开发遇到其它问题欢迎加群讨论

你可能感兴趣的:(前端,JavaScript,layui,javascript,前端)