SPA应用程序视图无法与JavaScript通信的可能原因

时间:2014-09-30 10:43:53

标签: javascript jquery html

所以我的手上有一点心灵感应者拒绝屈服。我的目标是每次访问一个页面时登录一个数据库。我已经在c#端创建了记录此信息的代码,我知道它有效。我现在要做的事情是相对直接的;每次在主视图列表上单击一个项目(即页面)(其作为SPA的shell并且不会更改)时,将页面名称发送到Javascript中的函数,该函数将依次与Web方法进行通信。问题是,当应用程序启动时,因为它是SPA,它会收集所有div(见下文)并呈现它们,由于某种原因,它不想通信并将参数传递给javascript函数,无论我在哪里把它(我把它放在标题上,我把它放在html下面等)。单独测试时onclick函数工作正常,但在此应用程序中,它拒绝工作。

我也尝试过使用' body onload =" PostName();"以及每个页面上的window.onload来调用该函数,但它也是一个空白。关于问题可能在哪里的一些想法?

<tr class="row">
        <td>
            <div class="tabbable">
                <ul class="nav nav-tabs nav-stacked" id="menuTabs">
                    <li class="active"><a href="#land" data-toggle="tab" onclick="javascript:PostName('Home')">Home</a></li>
                    <li class=""><a href="#tutuwaroadshow" data-toggle="tab" onclick="javascript:PostName('Roadshows')">Tutuwa roadshows</a></li>
                    <li class=""><a href="#faqsandpresentations" data-toggle="tab" onclick="javascript:PostName('Faqs')">FAQ's and presentations</a></li>
                    <li class=""><a href="#examplescenarios" data-toggle="tab" onclick="javascript:PostName('ExampleScenarios')">Example scenarios</a></li>
                    <li class=""><a href="#financialadvisors" data-toggle="tab" onclick="javascript:PostName('FinancialAdvisors')">Financial advisors</a></li>
                    <!--<li class=""><a href="#privateclients" data-toggle="tab">Private Clients</a></li>-->
                    <li class=""><a href="#trustdeeds" data-toggle="tab" onclick="javascript:PostName('TrustDeeds')">Trust deeds</a></li>
                    <li class=""><a href="#newsflashes" data-toggle="tab" onclick="javascript:PostName('Newsflashes')">Newsflashes</a></li>
                    <li class=""><a href="#usefullinksandcontacts" data-toggle="tab" onclick="javascript:PostName('Useful')">Useful links and contacts</a></li>
                    <li class=""><a href="#webinar" data-toggle="tab" onclick="javascript:PostName('Webinar')">Webinar</a></li>
                </ul>
            </div>
            <div class="newsflash"><a href="~/Content/files/Tutuwa%20Newsflash%204.pdf" target="_blank">Click here for the latest newsflash.</a></div>
        </td>
        <td rowspan="2">
            <div class="tab-content">
                <div class="tab-pane active" id="land">@Html.Partial("Land")</div>
                <div class="tab-pane" id="tutuwaroadshow">@Html.Partial("TutuwaRoadshow")</div>
                <div class="tab-pane" id="faqsandpresentations">@Html.Partial("FaqsAndPresentations")</div>
                <div class="tab-pane" id="examplescenarios">@Html.Partial("ExampleScenarios")</div>
                <div class="tab-pane" id="financialadvisors">@Html.Partial("FinancialAdvisors") </div>
                <div class="tab-pane" id="privateclients">@Html.Partial("PrivateClients")</div>
                <div class="tab-pane" id="trustdeeds">@Html.Partial("TrustDeeds")</div>
                <div class="tab-pane" id="newsflashes">@Html.Partial("NewsFlashes")</div>
                <div class="tab-pane" id="usefullinksandcontacts">@Html.Partial("UsefulLinksAndContacts")</div>
                <div class="tab-pane" id="webinar">@Html.Partial("Webinar")</div>
            </div>            

        </td>
    </tr>
</table>

该功能,目前位于标题上:

<head>
    <script type="text/javascript">
    function PostName(pageName) {
    debugger;
    //String PageName = "ExampleScenarios";
    $.ajax({
    type: "POST",
    url: 'HomeController/SaveVisitorHits',
    data: { s: pageName },
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (msg) {
    //do nothing
    },
    error: function (e) {
    // do nothing
    }
    });
    }
    </script>

    <title></title>
</head>

请注意,当我从应用程序中分离此代码时,它可以正常工作(请参阅http://jsfiddle.net/cLp6y51c/,这是由之前尝试提供帮助的其他用户创建的。问题出在应用程序中,可能是某些我不知道的设置。

这是我在每个页面上尝试的替代方法,但也不起作用:

<header>
    <img src="../../content/images/examplescenarios-header.jpg" style="height: 340px" />


    <script type="text/javascript">
        function PostName() {
            debugger;
            //String PageName = "ExampleScenarios";
            $.ajax({
                type: "POST",
                url: 'HomeController/SaveVisitorHits',
                data: { s: "ExampleScenarios" },
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    //do nothing
                },
                error: function (e) {
                    // do nothing
                }
            });
        }

        window.onload = PostName;
    </script>

</header>

<body onload="PostName();">

1 个答案:

答案 0 :(得分:0)

看起来您正在拨打错误的网址。我认为它是一个.NET MVC应用程序?在.NET MVC中,您不要在URL中加上Controller这个词。该网址应为Home/SaveVisitorHits