Javascript 如何动态更改引导模态体

因此，我将引导模式定义为：

   <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Error</h4>
                </div>
                <div class="modal-body">
                    <p> </p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

&时代；
错误

接近

---

我想用jscript编辑空的主体。我是一个Javascript初学者，所以我希望得到最简单的答案。

最简单的解决方案是-您可以使用Javascript的

innerHTML

像这样更改模态体的html-

//get your modal body by class and change its html
document.getElementByClass("modal-body").innerHTML = "<p>some text</p>";

//按类获取模态体并更改其html
document.getElementByClass（“模态体”）.innerHTML=“一些文本”
”；

请看一下小提琴

代码如下：

$(function(){
  $('.custom-modal').click(function(e){
    e.preventDefault();
    var mymodal = $('#myModal');
    mymodal.find('.modal-body').text('hello');
    mymodal.modal('show');

  });
})

试试这个：

$('.modalShow').click(function(event){
    event.preventDefault();
    var e = $(this);
    var title = e.data('title');
    var body = e.data('value');
    $('.modal-title').html(title);
    $('.modal-body').html(body);
    $('#myModal').modal('show');
});

我在C#中做了如下工作

C#：

System.Text.StringBuilder stringBuilder = new System.Text.StringBuilder();
        stringBuilder.Append(@"<script language='javascript'>");
        stringBuilder.Append(@"$('#errorModal').find('.modal-body').text('"+ your error message + "');");
        stringBuilder.Append(@"$('#errorModal').modal('show');");
        stringBuilder.Append(@"</script>");
        ClientScript.RegisterStartupScript(this.GetType(), "JSScript", stringBuilder.ToString());

    <div class="modal fade" id="errorModal" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Modal title</h4>
                </div>
                <div class="modal-body">
                    <p> </p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

System.Text.StringBuilder StringBuilder=新的System.Text.StringBuilder（）；
stringBuilder.Append（@“”）；
stringBuilder.Append（@“$（'#errorModal'）.find（'.modal body'）.text（'“+您的错误消息+“）；”）；
stringBuilder.Append（@“$（'#errorModal'）.modal（'show'）；”；
stringBuilder.Append（@“”）；
RegisterStartupScript（this.GetType（），“JSScript”，stringBuilder.ToString（））；

HTML:

System.Text.StringBuilder stringBuilder = new System.Text.StringBuilder();
        stringBuilder.Append(@"<script language='javascript'>");
        stringBuilder.Append(@"$('#errorModal').find('.modal-body').text('"+ your error message + "');");
        stringBuilder.Append(@"$('#errorModal').modal('show');");
        stringBuilder.Append(@"</script>");
        ClientScript.RegisterStartupScript(this.GetType(), "JSScript", stringBuilder.ToString());

    <div class="modal fade" id="errorModal" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Modal title</h4>
                </div>
                <div class="modal-body">
                    <p> </p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

&时代；
情态标题

接近

这是不正确的，您使用的是

#

而不是名为modal title，modal的

id

-body@MuhammadOmerAslam谢谢你的宝贵建议。我们可以将相应的

class

更改为

id

，这样就没什么大不了的了。当模式被隐藏时，它会抛出“cannotaccessinnerHTML of null”之类的语句