【问题标题】:JQuery plugin/script is not working on ASP.NET MVC 5 viewJQuery 插件/脚本不适用于 ASP.NET MVC 5 视图
【发布时间】:2014-08-08 23:42:48
【问题描述】:

我目前正在努力让这些 jQuery 插件中的任何一个与我生成的视图一起正常工作。我尝试捆绑 js/css,如下所示:

bundles.Add(new ScriptBundle("~/bundles/jquery")
            .Include("~/Scripts/jquery-{version}.js",

--> "~/Scripts/jquery.share.js"));

 bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css",
                  "~/Content/jquery.share.css"));

这是 HTML 和 JavaScript 本身。

<pre>
<script type="text/javascript">
    $('#mydiv').share({
        networks: ['facebook', 'pinterest', 'googleplus', 'twitter', 'linkedin', 'tumblr', 'email', 'stumbleupon', 'digg'],
        orientation: 'vertical',
        urlToShare: 'http://www.example.com',
        affix: 'left center'
    });
    </script>
</pre>


<div id="mydiv" class="share-affix" style="left: auto; top: 40%;">
    <a class="pop share-icon-twitter" title="Share this page on Twitter" href="#" style="display: block;"></a>
    <a class="pop share-icon-facebook" title="Share this page on Facebook" href="#" style="display: block;"></a>
    <a class="pop share-icon-pinterest" title="Share this page on Pinterest" href="#"></a>
    <a class="pop share-icon-googleplus" title="Share this page on GooglePlus" href="#"></a>
    <a class="pop share-icon-linkedin" title="Share this page on LinkedIn" href="#" style="display: block;"></a>
    <a class="pop share-icon-tumblr" title="Share this page on Tumblr" href="#" style="display: block;"></a>
</div>

【问题讨论】:

    标签: c# jquery asp.net-mvc-5


    【解决方案1】:

    将这一行添加到您的页面中。

     @Styles.Render("~/Content/css/")
     @Scripts.Render("~/bundles/jquery")
    

    【讨论】:

    • 我应该在页面顶部的剃刀 @{ } 括号之间还是在 中引用 @Styles.Render("~/Content/css") Scripts.Render("~/bundles/jquery") 也许,它们没有在网页的正确区域初始化。
    • @Styles.Render("~/Content/css") 在头部和 @Scripts.Render("~/bundles/jquery") 在页面底部。您还应该使用 $(document).ready(function(){//your code.}); 包装您的脚本;
    猜你喜欢
    • 2014-07-01
    • 1970-01-01
    • 2016-12-23
    • 2015-08-15
    • 1970-01-01
    • 1970-01-01
    • 2019-07-29
    • 1970-01-01
    • 2017-01-12
    相关资源
    最近更新 更多