我知道发生了什么，只要加上这个

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.js"></script>
<script>
    $(document).ready(function(){

    $('#submit').click(function(){

      $('#loginModal').modal('show'); 
    });

</script>

最明显的问题是，当您执行 AJAX 调用时，您实际上并没有阻止表单提交。您并不想提交页面，而是等待ajax请求结束，然后在success回调中处理响应。由于您使用的是jQuery，最简单的方法是从事件回调中返回false：

$(document).ready(function () {
            $("input#submit").click(function(){
                $.ajax({
                    type: "POST",
                    url: "test.php", // 
                    data: $('form.login_form').serialize(),
                    success: function(msg){
                        $("#form-content").modal('hide');   
                    },
                    error: function(){
                        alert("failure");
                    }
                });
                return false;//stop form submission
            });
        });

jQuery的return false相当于vanilla-JS的return false：

eventObj.preventDefault();//do not handle event in a normal fashion
eventObj.stopPropagation();//do not propagate event to other handlers

话虽如此，您的选择器和事件绑定还可以做得更好，我将为表单（<form id='modalformid'>）设置一个ID，并绑定 submit 事件（它可以通过用户按enter来触发），然后绑定处理程序，如下所示：

$('#modalformid').on('submit', function()
{
    var frm = $(this);//reference to the form that is submitted
    $.ajax({
        type: "POST",
        url: "test.php",
        data: frm.serialize(),//serialize correct form
        success: function(msg) {
            //the response from the server is in msg here!
            $("#form-content").modal('hide');   
        },
        error: function(){
            alert("failure");
        }
    });//your ajax call here
    return false;
});

我还会检查控制台，以确保在调用$(document).ready()之前 * 包括所有JS依赖项（即jQuery），并仔细检查名称冲突（在控制台console.log($)和console.log($ === jQuery)中）。
最后，$('form.login_form')选择器是不可靠的：根据定义，ID是唯一的。类不是。理论上，使用$('form.login_form')可以匹配多个表单。经验法则：类对于CSS规则很有用，而对于JS事件处理（例如委托）则不太有用，如果你想处理单个表单/元素：请使用ID。

我同意Elias的观点。在 AJAX 调用的情况下，你不想提交表单，因为页面会重新加载，你永远不会得到响应。
在JS中，您绑定了一个click事件，这很好，但是您的input是type="submit"，这将导致一个问题。
第一件事，把它拿掉。

<input id="submit" name="submit" value="Ok" class="btn btn-primary">

其次，在JQuery中，您引用了一个无效的表单选择器。

$('form.login_form').serialize()

没有login_form类。由于 AJAX 为您处理请求，我建议使用id代替并最小化属性。

<form id="login_form" role="form">

根据您提供的HTML，我必须假设您想要隐藏#loginModal而不是#form-content。

$(document).ready(function () {
    $("input#submit").click(function(){
        $.ajax({
            type: "POST",
            url: "test.php",
            data: $('form#login_form').serialize(),
            success: function(msg){
                $("#loginModal").modal('hide');
                // show validation error if applicable   
            },
            error: function(){
                alert("failure");
            }
        });
    });
});