如何在不触发回发的情况下打开Bootstrap模态框？

架构老林

2026-5-21

ASP.NET MVC 文件上传与模态框整合代码示例

我帮你把这段视图代码整理成规范的Markdown格式，同时标注几个关键的注意点：

完整格式化后的代码片段

@using (Html.BeginForm("Display", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{ 
    <div id="myModal" class="modal fade" role="dialog"> 
        <div class="modal-dialog"> 
            <div class="modal-content"> 
                <div class="modal-body"> 
                    <!-- 模态框内容需要在这里补充 -->
                </div> 
            </div> 
        </div> 
    </div>
    <button id="btn1" name="update" class="btn btn-danger" type="button">
        <!-- 按钮文本被截断，需补充 -->
    </button>
    <!-- 另一个显示模态框的按钮也需要在这里添加 -->
}

关键细节说明

文件上传必备配置：表单设置了enctype = "multipart/form-data"，这是ASP.NET MVC中接收上传文件的必要属性，缺少的话后端无法正确获取文件内容
Bootstrap模态框结构：使用了Bootstrap的模态框基础类（.modal、.modal-dialog、.modal-content），ID为myModal的容器可以通过JS控制显示/隐藏
操作按钮：当前代码里有一个ID为btn1的危险样式按钮（.btn-danger），名称为update，后续需要补充按钮文本和点击逻辑；另外还需要添加触发模态框显示的按钮（比如绑定data-toggle="modal"和data-target="#myModal"属性）