jsp 弹窗显示不出来

<div id="user_detail_id">
    <div class="tit">
        <h2>用户详情</h2>
    </div>
    <div class="mymodal-form clearfix">
        <form id="frm_id" method="post" action="">

            <c:set var="type"
                   value="${userId}"/>
            <input type="hidden" id="user_id" name="userId" value="${type}"/>

            <ul>
                <li>
                    <label style=" width:150px;">用户名：</label>
                      <input type="text" class="form-input" style="width:500px;"         id="username_id" name="username" readonly>
                </li>
            </ul>
          
            <ul>
                <li style="margin-top: 10px;"><label style="width: 40%;"></label>
                    <input type="submit"
                           value="进入修改"
                           class="btn btn-primary" onclick="changeDetail()">
                </li>
            </ul>
        </form>
    </div>
</div>

js方法

  function changeDetail() {
    showModal("change_detail_id", "change_detail_mask");
}

弹窗

<div id="change_detail_id" class="mymodal" style="display: none;">
    <div class="tit">
        <h2>修改用户信息</h2>
        <a href="javascript:;" class="closes" id="change_detail_close">取消</a>
    </div>
    <div class="mymodal-form clearfix">
        <form id="frm2_id" method="post" action="${ctx }/user/save">
            <c:set var="type"
                   value="${userId}"/>
            <input type="hidden" id="user2_id" name="userId" value="${type}"/>
            <ul>
                <li>
                    <label style=" width:150px;">用户名：</label>
                    <input type="text" class="form-input" style="width:500px;" id="username1_id" name="username"
                           validate="{required:true,maxByteLength:60}" readonly>
                </li>
            </ul>
            <ul>
                <li style="margin-top: 10px;"><label style="width: 40%;"></label>
                    <input type="submit"
                           value="修改"
                           class="btn btn-primary">
                </li>
            </ul>
        </form>
    </div>
</div>

获得数据

$(function () {
        var userId = $('#user_id').val();
        $.ajax({
            url: '${ctx}/user/userdetail',
            type: 'post',
            datatype: 'json',
            data: {userId: userId},
            success: function (result) {
                result = JSON.parse(result);
                if (result != null) {
                    if (result.status == 'true') {
                        var user = result.data;
                        if (user != null) {
                            $('#username_id').val(user.username);
                          
                            $('#user2_id').val(userId);
                            $('#username1_id').val(user.username);
                         /******此处为1***/
                        }
                    } else {
                        $.scojs_message(result.message, $.scojs_message.TYPE_ERROR);
                    }
                }
            },
            error: function (result) {
                requestError(result);
            }
        });
    })
    
    

这样的代码在页面中点击修改时闪退，但是如果我把showModel（"change_detail_id", "change_detail_mask"）放置于1处，则一点问题没有，数据也都是正确的。我不知道是哪个地方错了T T
或者我把弹窗的display：none关掉，在手动点击打开弹窗，就没有弹窗闪退的问题

---

原因是我把“进入修改” 的按钮设置为submit形式，但是我并不是提交东西，而是进入弹窗，所以弹窗出现闪退的情况