myFeeling

随笔记录一些简单的内容

一些简单的验证:

					if (!$('#name').val()) {
				        toastr.warning('请填写姓名')
				        return false
				    }
				    var email = $('#email').val()
				    var reg = /^([a-zA-Z]|[0-9])(\w|\-|\.)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
				    if (!email || !reg.test(email)) {
				        toastr.warning('请填写正确的邮箱格式')
				        return false
				    }

获取表单提交的内容:

					var data = $('#issue-submit').serializeArray();
					serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。
					serializeArray() 方法序列化表单元素(类似 .serialize() 方法),返回 JSON 数据结构数据。
					**注意:此方法返回的是 JSON 对象而非 JSON 字符串。需要使用插件或者第三方库进行字符串化操作。
					返回的 JSON 对象是由一个对象数组组成的,其中每个对象包含一个或两个名值对 —— name 参数和 value 参数(如果## 标题value 不为空的话)。举例来说:
						[ 
							  {name: 'firstname', value: 'Hello'}, 
							  {name: 'lastname', value: 'World'},
							  {name: 'alias'}, // 值为空
						]**

获取对应的url字段

					    var problemStr = '';
					    for (var key in problem) {
					        problemStr += problem[key]+',';
					    }
					    if (problemStr != '') {
					        problemStr = problemStr.substr(0,problemStr.length-1)
					        data.push({name:'**issue_file**', value: problemStr})
					    }
					*加粗部分是要传给后台的字段*

Ajax提交:

			   $.post(MyAjax.ajaxurl, data, function (res) {
			        res = JSON.parse(res);
			        console.log(res,'3')
			        if (res && res.result_code == 1) {
			            toastr.success('操作成功,3s后自动跳回首页')
			            setTimeout(function () {
			                window.location.href = 'http://wordpress.qeebu.cn/'
			            }, 3000)
			        } else {
			            toastr.error('操作失败');
			            flag = false;
			        }
		    })

加锁(防止表单重复提交)

			if (flag) {
			        return false;
			    }
			    flag = true;

获得想要数据的url

			var problem = {};
			function addArr(varname,id,url) {
			        varname[id] = url      
			}

删除数组中不要的值

		function removeFile(id,varname) {
		    // delete problem[id];
		    delete varname[id];
		    // console.log(problem)
		    $('#'+id).remove();
		}

完整的代码示例

		//问题截图
		if (typeof plupload != "undefined") {
		    
		    var uploaderproblem = new plupload.Uploader({
		        runtimes: 'html5,flash,silverlight,html4',
		        browse_button: 'pickfiles-problem',
		        container: document.getElementById('container-problem'),
		        url: ajaxurl,
		        flash_swf_url: '../js/Moxie.swf',
		        silverlight_xap_url: '../js/Moxie.xap',
		        multi_selection: true,
		        filters: {
		            max_file_size: '10mb',
		            mime_types: [
		                {title: "jpg,png,jpeg,doc,docx,xls,ppt,conf,txt,log,xlsx,pptx,mp4,swf", extensions: "jpg,png,jpeg,doc,docx,xls,ppt,conf,txt,log,xlsx,pptx,mp4,swf"}/*,
		            {title : "Zip files", extensions : "zip"}*/
		            ]
		        },
		
		        init: {
		            PostInit: function () {
		                document.getElementById('filelist-problem').innerHTML = '';
		            },
		            FilesAdded: function (up, files) {
		               
		                plupload.each(files, function (file) {
		                    // console.log(file)
		                    **这段是循环插入li标签**
		                    **id = file.id**
		                    **html = $("#filelist-problem").html();
		                    html += '<li class="extraADD" id="' + file.id + '">' + file.name + ' <span **onclick="removeFile(\''+id+'\',problem)"** class="glyphicon glyphicon-trash"></span></li>';
		                    **加粗部分是点击这个按钮,同时删除数组中的数据和界面上的对应内容**
		                    $("#filelist-problem").html(html)**
		
		                });
		                uploaderproblem.start();
		            },
		            BeforeUpload: function (up, file) {
		                //重点在这里,上传的时候自定义参数信息
		                uploaderproblem.setOption("multipart_params", {"action": "custom_upload"});
		            },
		
		            // UploadProgress: function (up, file) {
		            //     document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
		            // },
		
		            FileUploaded: function (up, file, info) {
		                res = info.response
		                res = JSON.parse(res)
		                **调用下面的addArr方法增加相应的数组**
		                **addArr(problem,file.id,res.data.url)**
		                $('#cover-input').val(res.data.url)
		                $('#cover-img').attr('src', res.data.url)
		//                officialLetter = {name:file.name,url:JSON.parse(info.response).url};
		                $('#pickfilesText-problem').text('重新上传');
		
		            }
		        }
		    });
		    uploaderproblem.init();
		}

一些总结## 标题
1.表单提交是要注意相应字段

猜你喜欢

转载自blog.csdn.net/Isleta_/article/details/88344814