Javascript 加载部分视图时引导折叠无法正常工作

引导折叠工作正常，但当部分视图加载到同一个视图时，问题就从这里开始

如果单击按钮折叠div，它只会闪烁，但不会折叠

以下是观点：

 <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>Dashboard</h1><small><button class="btn btn-xs btn-success" data-toggle="collapse" data-target="#collapsible">Toggle</button></small>
        </section>
        <!-- Main content -->
        <section class="content">
            <!-- Small boxes (Stat box) -->
            <div class="row">
                <div class="collapse" id="collapsible">
                    <div class="col-lg-3 col-xs-6">
                        <!-- small box -->
                        <div class="small-box bg-aqua">
                            <div class="inner">
                                <h3>150</h3>
                                <p>New Orders</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-bag"></i>
                            </div>
                            <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
                        </div>
                    </div><!-- ./col -->
                    <div class="col-lg-3 col-xs-6">
                        <!-- small box -->
                        <div class="small-box bg-green">
                            <div class="inner">
                                <h3>53<sup style="font-size: 20px">%</sup></h3>
                                <p>Bounce Rate</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-stats-bars"></i>
                            </div>
                            <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
                        </div>
                    </div><!-- ./col -->
                    <div class="col-lg-3 col-xs-6">
                        <!-- small box -->
                        <div class="small-box bg-yellow">
                            <div class="inner">
                                <h3>44</h3>
                                <p>User Registrations</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-person-add"></i>
                            </div>
                            <a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
                        </div>
                    </div><!-- ./col -->
                    <div class="col-lg-3 col-xs-6">
                        <!-- small box -->
                        <div class="small-box bg-red">
                            <div class="inner">
                                <h3>65</h3>
                                <p>Unique Visitors</p>
                            </div>
                            <div class="icon">
                                <i class="ion ion-pie-graph"></i>
                            </div>
                            <a href="#" class="small-box-footer">More info **strong text**<i class="fa fa-arrow-circle-right"></i></a>
                        </div>
                    </div><!-- ./col -->
                </div>
        </div><!-- /.row -->
            <!-- Main row -->
            <div class="row">
                <!-- Left col -->
                <section id="Results" class="col-lg-12">*This is where the partial view loads.</section>
            </div>
        </section><!-- /.content -->
    </div><!-- /.content-wrapper -->

仪表板开关
150
新订单

53%
反弹率

44
用户注册

65
独特访客

*这是局部视图加载的位置。

然后，这是在单击按钮时加载局部视图的javascript：

   <script>
    document.getElementById("showresults").onclick = function () { ViewResults() };
    function ViewResults() {
        $("#Results").load("@Html.Raw(Url.Action("Results","Dashboard"))");
    }

</script>

document.getElementById（“showresults”）.onclick=function（）{ViewResults（）}；
函数ViewResults（）{
$（“#Results”）.load（@Html.Raw（Url.Action（“Results”，“Dashboard”）））；
}

您的javascript是在客户端执行的，我相信它不会将

@Html.Raw（Url.Action（“Results”，“Dashboard”））

转换为Html。您的ASP.NET必须将其转换为HTML。它按原样输出字符串

@Html.Raw（）

。尝试在运行时使用浏览器工具检查DOM元素

确保转义双引号（“）字符，例如

@Html.Raw（Url.Action（\'Results\'，\'Dashboard\'））

，否则javascript将无法工作

试着做这样的事情

<script>
   document.getElementById("showresults").onclick = function () { ViewResults() };
   function ViewResults() {
       $("#Results").load("<div>This is just test</div>");
}

document.getElementById（“showresults”）.onclick=function（）{ViewResults（）}；
函数ViewResults（）{
$（“#结果”）.load（“这只是测试”）；
}

看看它是怎么工作的。

而不是 $（“#Results”）.load（@Html.Raw（Url.Action（“Results”，“Dashboard”）））

试试这个

---

$（“#Results”）.load（'Url.Action（“Results”，“Dashboard”））；

这是一个活动网页吗？你能提供一个指向该问题网页的链接吗？抱歉，它不是一个活动网页。这是否会影响折叠？除了Html.Raw（），我还能使用什么？如果javascript包含语法错误，那么折叠将不起作用。除了Html.Raw（）之外，我还能使用什么？已尝试此操作，但引导折叠仍然无法正常工作：（不要在部分视图页面上呈现布局或css，然后尝试。