0

循環するはずの画像が重なり合っているだけです。スクリーンショットはこちら

私の（非常に単純な）アプリケーションには、Viewという名前のアプリケーションがありますIndex.cshtml。このページには、PHP アプリでも使用したjquery Cycle Pluginを使用したいと思います。以下は私_Layout.cshtmlの関連コードです

    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render(Url.Content("~/Scripts/cycle.js")) // I added this line.
    @Scripts.Render("~/bundles/modernizr")

プラグイン ファイル(cycle.js)は、Scripts基本的なプロジェクト レイアウトによって生成されたフォルダーにあります。以下は私がそれを使用している方法です。次のコードも含まれています_Layout.cshtml(ここではコメントのみ)。

<script type="text/javascript">
    $(document).ready(function () {
        alert('test1');   //this is 'alerted'
        $('.images').cycle({
            fx: 'fade',
            speed: 2000
        });
        alert('test2!'); //this is NOT 'alerted'
    });
</script>

ブラウザでページをリクエストした後にソースを表示すると、次のようになります。

<title>Asp.Net MVC 4 Hello World App</title>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/jquery-1.7.1.js"></script>
<script src="/Scripts/cycle.js"></script>
<script src="/Scripts/modernizr-2.5.3.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
        alert('test1'); 
        $('.images').cycle({
            fx: 'fade',
            speed: 2000
        });
        alert('test12');
    });
</script>
</head>
<body>
...
</html>

画像のコンテナは次のとおりです。

        <div class="images" id="images">
            <img src="@Url.Content("../Images/image1.jpg")" alt="page image" />
            <img src="@Url.Content("../Images/image2.jpg")" alt="page image" />
            <img src="@Url.Content("../Images/image3.jpg")" alt="page image" />
            <img src="@Url.Content("../Images/image4.jpg")" alt="page image" />
        </div>

したがって、ファイルは正常にロードされています。問題はどのように機能するかだと思います$(document).ready()。前に置いたコードは何でも.cycle()機能しますが、その後は何も機能しないためです。

4

3 に答える 3

2

いくつかの（さらに）検索した後、問題を解決しました。どういうわけか、jquery が 2 回読み込まれていました。サイクル プラグイン ファイルの前に 1 回、その後にもう 1 回。このリンクredndaheadは、問題、具体的にはのコメントをキャッチするのに役立ちました。

Firebug コンソールを開くと、実際に jQuery が 2 回読み込まれていることがわかりました。タグの_Layout.cshtml下のページから次の行を削除したところ、プラグインが正常に動作するようになりました。<body>

 @Scripts.Render("~/bundles/jquery")

この SO 質問は、何が何であるか疑問に思っている人にとって非常に役立ちますbundles。すべての回答に感謝します。

于 2012-10-20T11:11:22.747 に答える
0

これにはいくつかの理由が考えられますが、多くの場合、最も一般的な解決策は次のとおりです。

@Scripts.Render("~/bundles/jquery") @RenderSection("スクリプト"、必須: false)

トルコ語を知っている場合は、この記事で詳細を確認できます

http://ogrenmeliyim.com/mvc-4-de-jquery-tanimlanmasi/

于 2013-01-13T16:20:28.107 に答える
-1 
<html>
<head>
<script 

 src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">

</script>
    <script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script>
    $(document).ready(function () {
        $("p").click(function () {
            $(this).hide();
        });
    });
</script>
</head>
<body>

<p>When you click on this paragraph , it will hide.</p>


</body>
</html>
于 2015-03-16T10:56:48.313 に答える