0

一番上にナビゲーションバーを追加しようとしていますが、たくさんの個別のhtmlファイルを作成するため、ナビゲーションを1つのファイルに保持したいので、変更を加えるとすべてのページで変更されます。ページ自体にコードを入力すると問題なく動作しますが、外部ファイルにある場合は別のビューになります。

Jquery スニペットは次のとおりです。

var snippet =   '   <div id="topMainNav">' +
    '   <ul>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">Find a Doctor</a>' +
    '       </li>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">Why Interfaith</a>' +
            '               <div class="dropdown" id="dropdown_one">' +
    '               <div class="subMainNav" style="padding: 10px;">History & Mission</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Executive Director</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Locations & Directions</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Service Centers</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Career Opportunities</div>' +
    '               <div class="subMainNav" style="padding: 10px;">News & Events</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Parking</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Places To Stay</div>' +
    '           </div>' +
    '       </li>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">Medical Services</a>' +
    '           <div class="dropdown" id="dropdown_two">' +
    '               <div class="subMainNav" style="padding: 10px;"><a href="#">Behavioral Health</a></div>' +
    '               <div class="subMainNav" style="padding: 10px;">Clinical Laboratory</div>' +          
    '               <div class="subMainNav" style="padding: 10px;">Dentistry</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Emergency</div>' +      
    '               <div class="subMainNav" style="padding: 10px;">Gynecology</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Medicine</div>' +         
    '               <div class="subMainNav" style="padding: 10px;">Pastoral</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Pediatrics</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Physical Medicine & Rehab</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Radiology</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Surgery</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Other Services</div>' +
    '           </div>' +
    '       </li>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">Medical Trainings</a>' +
    '           <div class="dropdown" id="dropdown_three">' +
    '               <div class="subMainNav" style="padding: 10px;">Medical Training</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Behavioral Health</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Predoctoral Externship</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Podiatric Residency</div>' +          
    '               <div class="subMainNav" style="padding: 10px;">Dental Residency</div>' +
    '               <div class="subMainNav" style="padding: 10px;">Pulmonary Residency</div>' +
    '           </div>' +
    '       </li>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">For Patients & Visitors</a>' +
    '           <div class="dropdown" id="dropdown_four">' +
    '               <p><a href="#">This is a Link</a></p>' +
    '               <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin blandit sodales justo, id fringilla eros dapibus vitae. Morbi molestie enim diam, a vulputate neque. Morbi sit amet nunc.</p>' +
    '           </div>' +
    '       </li>' +
    '       <li class="mainNav">' +
    '           <a href="" class="navlink">Contact Us</a>' +
    '       </li>' +
    '   </ul>' +
    '</div>';

$(function(){$('.writeNav').append (snippet);});

私のHTMLページには次のものがあります：

calling the external jscript file:
<script type="text/javascript" src="theScriptsStyles/miscScripts.js"></script>

そして、htmlの本文に私はこれを持っています:

<div class="writeNav"></div>

プルダウン メニューがあると想定されているため、マウスをその上に置くと、機能しないスライド ダウン メニューが表示されます。誰でも私が間違っていることを教えてください。

ありがとう

4

1 に答える 1

0

divが作成される前でも、スクリプトが読み込まれていると思います。そのため、そのクラスの要素を見つけることができません。/それが当てはまるかどうかを確認してください

于 2012-07-12T21:28:39.397 に答える