jquery文件上传复选框表单答案

【问题标题】：jquery file upload check box formjquery文件上传复选框表单
【发布时间】：2018-01-28 05:43:43
【问题描述】：

我是 JS 的初学者，我决定使用这个库： https://blueimp.github.io/jQuery-File-Upload/

我的问题如下：

我必须发送（在 FormData，因此是附加表单中）2 个复选框的值。令人担忧的是，当页面加载并且客户端更改其值时复选框为假，在我的代码中，formdata 获取两个复选框的值，但在更改期间不更新它们（选中/未选中）。

$(function() {
    "use strict";
    var e = $("<button/>").addClass("intimity-button-dark").prop("disabled", !0).text("Processing...").on("click", function() {
        var param1 = $('#guest').is("checked");
        console.log(param1);
        var e = $(this),a = e.data();
        e.off("click").text("Abort").on("click", function() {
            e.remove(), a.abort()
        }), a.submit().always(function() {
            e.remove()
        })
    });
    $("#fileupload").fileupload({
        url: "/server/php/",
        dataType: "json",
        autoUpload: !1,
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png|mov|mp4|avi)$/i,
        maxFileSize: 5e6,
        disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
        previewMaxWidth: 200,
        previewMaxHeight: 300,
        formData: {guest: $("#guest").prop('checked'), signed : $("#signed").prop('checked')},
        previewCrop: !0
    }).on("fileuploadadd", function(a, n) {
        n.context = $("<div/>").addClass('col-xs-6 col-sm-4').appendTo("#files"), $.each(n.files, function(a, t) {
            var r = $("<p/>").append($("<span/>").text(t.name));
            a || r.append("<br>").append(e.clone(!0).data(n)), r.appendTo(n.context)
        })
    }).on("fileuploadprocessalways", function(e, a) {
        var n = a.index,
            t = a.files[n],
            r = $(a.context.children()[n]);
        t.preview && r.prepend("<br>").prepend(t.preview), t.error && r.append("<br>").append($('<span class="text-danger"/>').text(t.error)), n + 1 === a.files.length && a.context.find("button").text("Upload").prop("disabled", !!a.files.error)
    }).on("fileuploadprogressall", function(e, a) {
        var n = parseInt(a.loaded / a.total * 100, 10);
        $("#progress .progress-bar").css("width", n + "%")
    }).on("fileuploaddone", function(e, a) {
        $.each(a.result.files, function(e, n) {
            if (n.url) {
                var t = $("<a>").attr("target", "_blank").prop("href", n.url);
                $(a.context.children()[e]).wrap(t)
            } else if (n.error) {
                var r = $('<span class="text-danger"/>').text(n.error);
                $(a.context.children()[e]).append("<br>").append(r)
            }
        })
    }).on("fileuploadfail", function(e, a) {
        $.each(a.files, function(e) {
            var n = $('<span class="text-danger"/>').text("File upload failed.");
            $(a.context.children()[e]).append("<br>").append(n)
        })
    }).prop("disabled", !$.support.fileInput).parent().addClass($.support.fileInput ? void 0 : "disabled")
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span>Add files...</span>
<input id="fileupload" style="display:none;" type="file" name="files[]" multiple>

<input type="checkbox" id="guest" name="guest" value="1">
<input type="checkbox" id="signed" name="signed" value="1">

那么，如何让“格式”检索当前值？

【问题讨论】：

标签： javascript jquery checkbox jquery-file-upload

【解决方案1】：

要从复选框中获取值，您应该使用这个 $('#checkbox').is(':checked')

【讨论】：

我已经试过了，在这两种情况下，它都有效，但是formdata中的值没有更新。

【解决方案2】：

好吧，我赢了：

        var e = $ ("<button />"). addClass ("intimity-button-dark"). prop ("désactivé",! 0) .text ("Traitement ..."). on ("clic", fonction() {
        $ ('# fileupload'). bind ('fileuploadsubmit', fonction (e, données) {
            data.formData = {invité: $ ('# invité'). is (": checked"), signé: $ ('# signed'). is (": checked")};
            console.log ($ ('# invité'). is ("vérifié") + "|" + $ ('# signed'). is ("checked"))
        });
        var param1 = $ ('# invité'). est ("vérifié");
        console.log (param1);
        var e = $ (this), a = e.data ();
        e.off ("click"). text ("Abort"). on ("clic", function () {
            e.remove (), a.abort ()
        }), a.submit (). always (function () {
            e.remove ()
        })
    });
    $ ("# fileupload"). fileupload ({
        url: "/ server / php /",
        dataType: "json",
        autoUpload:! 1,
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png|mov|mp4|avi)$/i,
        maxFileSize: 5e6,
        disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
        previewMaxWidth: 200,
        AperçuMaxHauteur: 300,
        previewCrop:! 0
    })

.bind（'fileuploadsubmit' 允许我重新配置文件上传，当我单击“上传”按钮时，它会通过直接发送复选框的当前值来修改配置。

【讨论】：