2017-01-07 12 views
0

出力がありません。誰もこの問題から私を助けることができますか?アコーディオンはasp.netの関数ではありませんmvc

私はこのMVCプロジェクトをASP.netで数日間働いています。私は自分のプロジェクトにjQuery-UIを統合したいと思っています。私はすべての必要なファイルをインポートしましたが、出力はありませんでした。私は以下のサンプルアコーディオンコードを含めています。

<div id="acc"> 
<h4>Section1</h4> 
    <div> 
     Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. 
    </div> 
<h4>Section2</h4> 
    <div> 
     Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. 
    </div> 
<h4>Section3</h4> 
    <div> 
     Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. 
    </div> 
</div> 
<script src="~/Scripts/jquery-1.10.2.min.js"></script> 
<script src="~/Scripts/jquery-ui.min.js"></script> 
<link href="~/Content/jquery-ui.css" rel="stylesheet" /> 
<script> 
    $(document).ready(function() 
    { 
     $("#acc").accordion({event:"mouseover"}); 
    } 
    ); 
</script> 

答えて

0
  1. のjQuery UIライブラリのスクリプトがページに含まれており、
  2. はそれがjQueryの自体の後に含まれていることを確認していることを確認します。
  3. ブラウザがこれらのファイルを要求していることを確認して、サーバーから返されるようにします。 Chromeやブラウザのデバッガを使用して、[ネットワーク]タブに移動します。次に、ページを更新して、これらのファイルを取得する要求が行われていることを確認し、応答がエラーではないことを確認します。ファイルが見つからないためにエラーが発生した場合は、パスが見つかるように修正してください。
+0

あなたが言ったように私は同じでしたが、私は、出力を取得できませんでした –

0

あなたのコードはうまく見えます - 下のスニペットを参照して、HTMLを取り込み、相対的なJS/CSSファイルを置き換えて、Google hosted Libraries CDNのものに置き換えてください。 1つの選択肢は、Googleや他のホストからホストされているファイルを使用することです。これは、世界中のユーザーが読み込み時間を短縮できるなどの利点があります(詳細はthis answerを参照)。

独自のファイルをホストし続ける場合は、ファイルが適切にダウンロードされていることを確認してください。ほとんどのブラウザーでは、F12を押してブラウザー・コンソールをロードできます。詳細はthis pageのビデオをご覧ください。あなたは、CSSファイルが見つかりませんでした以下の画像、404エラーのようなエラーが表示される場合があります。

enter image description here

$(document).ready(function() { 
 
    $("#acc").accordion({ 
 
    event: "mouseover" 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 
<div id="acc"> 
 
    <h4>Section1</h4> 
 
    <div> 
 
    Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum 
 
    a velit eu ante scelerisque vulputate. 
 
    </div> 
 
    <h4>Section2</h4> 
 
    <div> 
 
    Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. 
 
    </div> 
 
    <h4>Section3</h4> 
 
    <div> 
 
    Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam 
 
    nisi, eu iaculis leo purus venenatis dui. 
 
    </div> 
 
</div>

関連する問題