请输入一个带有效的mimetype的值，这个错误信息是什么意思，表单验证框架的问题？

来源：9-11 保存背景音乐bgm到数据库

cjozGV

2020-05-25

写回答

5回答

风间影月

2020-05-25

//img.mukewang.com/szimg/5ecb3e6409e87b1719560716.jpg

是不是你选择的文件有问题

另外输入框什么的都把内容给输入

风间影月

这可能不是代码问题，你发群里看看大家有么有遇到过，感觉是文件问题

2020-05-25

共2条回复

慕婉清1186051

2020-12-01

accept="audio/*"就好啦

MyIceCream

2020-06-09

大佬我也这个情况，请问解决了吗，怎么解决的

Hewie001

我也是这样。。你解决了么。

2020-06-19

共1条回复

cjozGV

提问者

2020-05-25

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!-- BEGIN PAGE HEADER-->
<!-- BEGIN PAGE BAR -->
<div class="page-bar">
   <ul class="page-breadcrumb">
      <li>
         <span>首页</span>
         <i class="fa fa-circle"></i>
      </li>
      <li>
         <span>bgm管理</span>
         <i class="fa fa-circle"></i>
      </li>
      <li>
         <span>添加背景音乐</span>
      </li>
   </ul>
</div>
<!-- END PAGE BAR -->
<!-- END PAGE HEADER-->

<div class="row">
   <div class="col-md-12">
      <br/>
      <!-- 意见反馈 start -->
      <div class="tabbable-line boxless tabbable-reversed">
         <div class="portlet box green-jungle">
            <div class="portlet-title">
               <div class="caption">
                  <i class="icon-plus"></i>添加背景音乐
               </div>
            </div>

            <div class="portlet-body form">

               <!-- BEGIN FORM-->
               <form id="addBgmForm" class="form-horizontal">
                  <div class="form-body">

                     <div class="form-group">
                        <label class="col-md-3 control-label"><span class="field-required"> * </span>歌手：</label>
                        <div class="col-md-4">
                           <div id="input-error">
                              <input id="author" name="author" type="text" class="form-control" placeholder="1-4字">
                           </div>
                        </div>
                     </div>

                     <div class="form-group">
                        <label class="col-md-3 control-label"><span class="field-required"> * </span>歌曲：</label>
                        <div class="col-md-4">
                           <div id="input-error">
                              <input id="name" name="name" type="text" class="form-control" placeholder="1-50字">
                           </div>
                        </div>
                     </div>

                     <div class="form-group">
                        <label class="col-md-3 control-label"><span class="field-required"> * </span>音乐片段</label>
                        <div class="col-md-4">
                           <div id="input-error">
                              <input type="hidden" id="path" name="path" class="form-control"/>

                              <input id="file" type="file" name="file" data-url="<%=request.getContextPath() %>/video/bgmUpload.action" accept=".mp3"/>

                              <div id="bgmContent"></div>
                           </div>

                        </div>
                     </div>

                  </div>

                  <div class="form-actions">
                     <div class="row">
                        <div class="col-md-offset-3 col-md-9">
                           <button type="submit" class="btn green-jungle">提 交</button>
                           <button type="reset" class="btn grey-salsa btn-outline">取  消</button>
                        </div>
                     </div>
                  </div>
               </form>
               <!-- END FORM-->

            </div>
         </div>
      </div>

   </div>
</div>

<script type="text/javascript">

    $("#file").fileupload({
        pasteZone: "#bgmContent",
        dataType: "json",
        done: function(e, data) {
            console.log(data);

            if (data.result.status != '200') {
                alert("长传失败...");
            } else {
                //开发环境的ip地址
                var bgmServer = $("#bgmServer").val();
                //开发环境ip拼接上音乐的内容
                var url = bgmServer + data.result.data;
                //点击bgmContent弹窗音乐播放
                $("#bgmContent").html("<a href='" + url + "' target='_blank'>点我播放</a>");
                //保存到数据库
                $("#path").attr("value", data.result.data);
            }

        }
    });

    var submitBgm = function() {
        $('#addBgmForm').ajaxSubmit({
            url: $('#hdnContextPath').val() + '/video/addBgm.action',
            type: 'POST',
            success: function(data) {

                if (data.status == 200 && data.msg == 'OK') {
                    alert('BGM添加成功...')
                } else {
                    alert('BGM添加失败...')
                }

                // $("#bgmListMenu").click();
            }
        });
    }

    $('#addBgmForm').validate({
        errorElement: 'span', //default input error message container
        errorClass: 'help-block', // default input error message class
        focusInvalid: false, // do not focus the last invalid input
        ignore: "", // validate all fields including form hidden input
        rules: {
            author: {
                required: true,
                rangelength: [1,8]
            },
            name: {
                required: true,
                rangelength: [1,50]
            },
            path: {
                required: true
            }
        },
        messages: {
            author: {
                required: "歌手不能为空.",
                rangelength: "歌手长度请控制在1-8位."
            },
            name: {
                required: "歌曲不能为空.",
                rangelength: "歌曲长度请控制在1-50位."
            },
            path: {
                required: "路径不能为空."
            }
        },
        invalidHandler: function(event, validator) { //display error alert on form submit
            $('.alert-danger', $('#addBgmForm')).show();
        },

        highlight: function(element) { // hightlight error inputs
            $(element).closest('.form-group').addClass('has-error'); // set error class to the control group
        },
        success: function(label) {
            label.closest('.form-group').removeClass('has-error');
            label.remove();
        },
        errorPlacement: function(error, element) {
            error.insertAfter(element.closest('#input-error'));
        },
        submitHandler: function(form) {
            // FIXME
            submitBgm();
        }
    });
</script>

roboguru

请问现在解决了吗，我遇到同样的问题了。。

2022-06-08

共1条回复

风间影月

2020-05-25

Form里有个类型看看是不是写错了，后台代码直接复制进去使用就行了哈

风间影月

cjozGV

你把错误复制到百度搜一下看看，肯定是哪个细节地方有问题

2020-05-25

共2条回复