99 lines
3.0 KiB
JavaScript
99 lines
3.0 KiB
JavaScript
(function(mui, window, document, undefined) {
|
|
mui.init();
|
|
var get = function(id) {
|
|
return document.getElementById(id);
|
|
};
|
|
var qsa = function(sel) {
|
|
return [].slice.call(document.querySelectorAll(sel));
|
|
};
|
|
var ui = {
|
|
question: get('question'),
|
|
contact: get('contact'),
|
|
imageList: get('image-list'),
|
|
submit: get('submit')
|
|
};
|
|
ui.clearForm = function() {
|
|
ui.question.value = '';
|
|
ui.contact.value = '';
|
|
ui.imageList.innerHTML = '';
|
|
ui.newPlaceholder();
|
|
};
|
|
ui.getFileInputArray = function() {
|
|
return [].slice.call(ui.imageList.querySelectorAll('input[type="file"]'));
|
|
};
|
|
ui.getFileInputIdArray = function() {
|
|
var fileInputArray = ui.getFileInputArray();
|
|
var idArray = [];
|
|
fileInputArray.forEach(function(fileInput) {
|
|
if (fileInput.value != '') {
|
|
idArray.push(fileInput.getAttribute('id'));
|
|
}
|
|
});
|
|
return idArray;
|
|
};
|
|
var imageIndexIdNum = 0;
|
|
ui.newPlaceholder = function() {
|
|
var fileInputArray = ui.getFileInputArray();
|
|
if (fileInputArray &&
|
|
fileInputArray.length > 0 &&
|
|
fileInputArray[fileInputArray.length - 1].parentNode.classList.contains('space')) {
|
|
return;
|
|
}
|
|
imageIndexIdNum++;
|
|
var placeholder = document.createElement('div');
|
|
placeholder.setAttribute('class', 'image-item space');
|
|
var closeButton = document.createElement('div');
|
|
closeButton.setAttribute('class', 'image-close');
|
|
closeButton.innerHTML = 'X';
|
|
closeButton.addEventListener('click', function(event) {
|
|
event.stopPropagation();
|
|
event.cancelBubble = true;
|
|
setTimeout(function() {
|
|
ui.imageList.removeChild(placeholder);
|
|
}, 0);
|
|
return false;
|
|
}, false);
|
|
var fileInput = document.createElement('input');
|
|
fileInput.setAttribute('type', 'file');
|
|
fileInput.setAttribute('accept', 'image/*');
|
|
fileInput.setAttribute('id', 'image-' + imageIndexIdNum);
|
|
fileInput.addEventListener('change', function(event) {
|
|
var file = fileInput.files[0];
|
|
if (file) {
|
|
var reader = new FileReader();
|
|
reader.onload = function() {
|
|
//处理 android 4.1 兼容问题
|
|
var base64 = reader.result.split(',')[1];
|
|
var dataUrl = 'data:image/png;base64,' + base64;
|
|
//
|
|
placeholder.style.backgroundImage = 'url(' + dataUrl + ')';
|
|
}
|
|
reader.readAsDataURL(file);
|
|
placeholder.classList.remove('space');
|
|
ui.newPlaceholder();
|
|
}
|
|
}, false);
|
|
placeholder.appendChild(closeButton);
|
|
placeholder.appendChild(fileInput);
|
|
ui.imageList.appendChild(placeholder);
|
|
};
|
|
ui.newPlaceholder();
|
|
ui.submit.addEventListener('tap', function(event) {
|
|
if (ui.question.value == '' ||
|
|
(ui.contact.value != '' &&
|
|
ui.contact.value.search(/^(\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+)|([1-9]\d{4,9})$/) != 0)) {
|
|
return mui.toast('信息填写不符合规范');
|
|
}
|
|
plus.nativeUI.showWaiting();
|
|
feedback.send({
|
|
question: ui.question.value,
|
|
contact: ui.contact.value,
|
|
images: ui.getFileInputIdArray()
|
|
}, function() {
|
|
plus.nativeUI.closeWaiting();
|
|
mui.toast('感谢您的建议~');
|
|
ui.clearForm();
|
|
mui.back();
|
|
});
|
|
}, false);
|
|
})(mui, window, document, undefined); |