cuiqian2004
2024-09-27 2c523baaae59f4033f56b78128ffb62cf5a7eb38
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
(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);