在div

时间:2015-12-27 08:18:53

标签: asp.net-mvc-5

大家好我有2个视图我在另一个视图中调用另一个视图,这是我的view1设计

<div class="page-container">
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <span class="navbar-brand">Web Mail</span>
            </div>
        </div>
        <div class="container">
            <div class="row row-offcanvas row-offcanvas-left">
                <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation">
                    <div data-spy="affix" data-offset-top="45" data-offset-bottom="90" class="affix-top">
                        <ul class="nav" id="sidebar-nav">
                            @foreach (var item in Model)
                            {
                                <li><a href="#" onclick="onClick()">@item.folderName</a></li>
                            }
                        </ul>
                    </div>
                </div>

                <div class="col-xs-12 col-sm-9" data-spy="scroll" data-target="#sidebar-nav">
                    <div id="mailInbox"></div>
                </div>
            </div>
        </div>
    </div>
    <div id="ToDisplayResult"></div>
    <script type="text/javascript">
        function onClick() {$
            $('#mailInbox').load("/Controller/View2");
        }
    </script>

在我的第二个视图中,我有以下设计

<a id="btnNew" class="btn btn-success" href="#">
        <span class="glyphicon glyphicon-pencil"></span> Compose
    </a>
<div id='myModal' class='modal fade'>
    <div class="modal-dialog">
        <div class="modal-content">
            <div id='myModalContent'>Test</div>
        </div>
    </div>
</div>
<div id="popup">&nbsp;Your message has been sent </div>
        @section Scripts{
            <script>
                $(document).ready(function () {
                    $("#btnNew").button().click(function () {
                        alert('hi');
                    });
                })
            </script>
        }

但是我没有得到警报,所以有人可以帮我这个

1 个答案:

答案 0 :(得分:1)

原因是因为$(document).ready事件只在主视图加载时被触发一次。将javascript放在部分视图中也是不好的做法。我建议你在一个单独的js文件中执行此操作:

$('#mailInbox').on('click', '#btnNew', function () {
     alert('hi');
});

您将在主视图中引用:

@section Scripts {
    <script type="text/javascript" src="myscript.js"></script>
}

请注意,我已使用.on()函数订阅#btnNew的点击事件。这允许订阅DOM中尚不存在的某些元素上的事件。稍后,当您进行AJAX调用并使用部分更新#mailInbox的内容时,#btnNew元素将被注入DOM,点击订阅将生效。

所以现在,剩下的就是从你的部分中删除这个脚本:

<a id="btnNew" class="btn btn-success" href="#">
    <span class="glyphicon glyphicon-pencil"></span> Compose
</a>
<div id="popup">&nbsp;Your message has been sent </div>