2013-01-03 90 views
0

是否可以在一個html文檔中使用外部js文件和jQuery兩次?我有第一個運行,但第二次調用它不起作用。此外,外部js在Internet Explorer中打開時不起作用。調用外部js兩次

<!DOCTYPE html > 
<html> 
<head> 

<link href="css/stylesheetelaine.css" rel="stylesheet" type="text/css"/> 




<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> 

<script type="text/javascript" src="js/script2.js"> </script> 

<script src="js/jQuery/jquery.monte.js"></script>  



<meta charset="utf-8"> 
<title>Gallery</title> 


</head> 

<body> 

<div id="wrapper"> 

<div id="title"> 

<h1><a href="index.html"><img src="img/elaine4.png" width="517" height="185" alt="elaine cullinan"></a><img src="img/elainefilligree.png" width="235" height="251" alt="elaine"></h1> 


<div id="nav"> 
<ul id> 

<li><a href="about.html" title="About">About</a></li> 
<li><a href="tattoo.html" title="Tattoo">Tattoo</a></li> 
<li><a href="makeup.html" title="Make Up">Make Up</a></li> 
<li><a href="gallery.html" title="Gallery">Gallery</a></li> 
<li><a href="contact.html" title="Contact">Contact</a></li> 

</ul> 
</div> 
</div> 

<div id="gallback"> 

<h2> Tattoos </h2> 

<div id="gallerywrap"> 

    <div id='example1' class='container'> 
     <img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/> 

     <img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/> 

     <img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/> 

     <img src="img/tattoogallery/clown.jpg" alt='Clown'/> 

     <img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/> 

     <img src="img/tattoogallery/flouder.jpg" alt='Flounder'/> 

     <img src="img/tattoogallery/grenade.jpg" alt='Grenade'/> 

     <img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/> 
    <img src="img/tattoogallery/13.jpg" alt='13'/> 

    <img src="img/tattoogallery/mechwing.jpg" alt='Mechanical Wing'/> 

    <img src="img/tattoogallery/qotsa.jpg" alt='QOTSA'/> 

    <img src="img/tattoogallery/horsecartatt.jpg" alt='Carousel'/> 

    <img src="img/tattoogallery/lovefinger.jpg" alt='Love finger tatt'/> 

    <img src="img/tattoogallery/hakun.jpg" alt='Hakuna Matata'/> 

    <img src="img/tattoogallery/romannum.jpg" alt='Roman Numerals'/> 

    <img src="img/tattoogallery/slayer.jpg" alt='Slayer'/> 

    <img src="img/tattoogallery/shamrock.jpg" alt='Shamrock'/> 

    <img src="img/tattoogallery/scriptarm.jpg" alt='Script'/> 

    <img src="img/tattoogallery/skull.jpg" alt='Skull'/> 

    <img src="img/tattoogallery/wristfoot.jpg" alt='Wrist and Foot Tatts'/> 

    <img src="img/tattoogallery/zombieariel.jpg" alt='Zombie Ariel'/> 

    <img src="img/tattoogallery/script.jpg" alt='Script'/> 

    <img src="img/tattoogallery/chinese.jpg" alt='Chinese Symbols'/> 

    <img src="img/tattoogallery/colflower.jpg" alt='Flower'/> 

    <img src="img/tattoogallery/scriptfoot.jpg" alt='Foot Script Tatt'/> 

    <img src="img/tattoogallery/Triton.jpg" alt='Triton'/> 

    <img src="img/tattoogallery/zombiefingers.jpg" alt='Zombie Finger Tatt'/> 

    <img src="img/tattoogallery/tyler.jpg" alt='Script'/> 

    <img src="img/tattoogallery/3ursula.jpg" alt='Ursula'/> 

    <img src="img/tattoogallery/locket.jpg" alt='Locket'/> 

    <img src="img/tattoogallery/mechwing2.jpg" alt='Mechanical Wings'/> 

    <img src="img/tattoogallery/backscript.jpg" alt='Script'/> 

    <img src="img/tattoogallery/wingcolor.jpg" alt='Coloured Wing'/> 


    </div> 

</div> 


</div> 


<div id="gallback"> 

<h2> Make Up </h2> 

<div id="gallerywrap"> 

    <div id='example1' class='container'> 
     <img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/> 

     <img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/> 

     <img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/> 

     <img src="img/tattoogallery/clown.jpg" alt='Clown'/> 

     <img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/> 

     <img src="img/tattoogallery/flouder.jpg" alt='Flounder'/> 

     <img src="img/tattoogallery/grenade.jpg" alt='Grenade'/> 

     <img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/> 



    </div> 

</div> 


</div> 



</div> 
</body> 

</html> 

外部:

 $(function() { 
      // Unstyled Example 
      $.monte('#example1'); 


      // Styled Buttons Example 
      // (see the CSS in the above style block) 
      $.monte('#example2', {auto:false}); 


      // Callback Example 
      // Format and append the HTML: 
      $('#example3 > img').each(function(){ 
       $(this) 
       .wrap('<div style="position:relative"/>') 
       .parent() 
       .append('<div><p>' + $(this).attr('alt') + '</p></div>') 
       .append('<img src="frame.png" alt="" class="frame"/>'); 
      }); 
      // Hide the text on all but the center slide: 
      $('#example3 div div').css({opacity: 0}).eq(0).css({opacity: 0.8}); 
      // Using the callbacks to reveal and hide the text: 
      $.monte('#example3', { 
       auto:false, 
       callbackIn: function() { 
        $(this[0]).find('div').animate({opacity: 0.8}, 450); 
       }, 
       callbackAway: function() { 
        $(this[0]).find('div').animate({opacity: 0}, 450); 
       } 
      }); 
     }); 
+1

叫我瘋了,但我只能看到3個JS文件,每個包含1次。如果你的問題是你是否可以包含多個外部JS文件,那麼答案是肯定的。非常非常。除了現在的大部分頁面,一天都沒有機會。你確定你的文件已上傳嗎? – h2ooooooo

+0

你想從JavaScript運行的東西? JavaScript在哪裏執行?我可能會錯過一些東西。 – kevingreen

+0

請發佈一些JavaScript,我不明白你想要多次調用什麼。我看到了包含,但沒有明確地將JavaScript轉化爲行動的任何地方。它們是否在外部文件中被調用?請提供一些代碼/上下文,謝謝。 – kevingreen

回答

0

不要讓多個DOM具有相同ID的對象。 ID應該是唯一的標識符。當您多次使用相同的ID時,最有可能只處理具有相同ID的第一個對象。

重命名該ID並用新ID調用它。

<!DOCTYPE html > 
<html> 
<head> 

<link href="css/stylesheetelaine.css" rel="stylesheet" type="text/css"/> 




<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> 

<script type="text/javascript" src="js/script2.js"> </script> 

<script src="js/jQuery/jquery.monte.js"></script>  



<meta charset="utf-8"> 
<title>Gallery</title> 


</head> 

<body> 

<div id="wrapper"> 

<div id="title"> 

<h1><a href="index.html"><img src="img/elaine4.png" width="517" height="185" alt="elaine cullinan"></a><img src="img/elainefilligree.png" width="235" height="251" alt="elaine"></h1> 


<div id="nav"> 
<ul id> 

<li><a href="about.html" title="About">About</a></li> 
<li><a href="tattoo.html" title="Tattoo">Tattoo</a></li> 
<li><a href="makeup.html" title="Make Up">Make Up</a></li> 
<li><a href="gallery.html" title="Gallery">Gallery</a></li> 
<li><a href="contact.html" title="Contact">Contact</a></li> 

</ul> 
</div> 
</div> 

<div id="gallback"> 

<h2> Tattoos </h2> 

<div id="gallerywrap"> 

    <div id='example1' class='container'> 
     <img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/> 

     <img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/> 

     <img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/> 

     <img src="img/tattoogallery/clown.jpg" alt='Clown'/> 

     <img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/> 

     <img src="img/tattoogallery/flouder.jpg" alt='Flounder'/> 

     <img src="img/tattoogallery/grenade.jpg" alt='Grenade'/> 

     <img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/> 
    <img src="img/tattoogallery/13.jpg" alt='13'/> 

    <img src="img/tattoogallery/mechwing.jpg" alt='Mechanical Wing'/> 

    <img src="img/tattoogallery/qotsa.jpg" alt='QOTSA'/> 

    <img src="img/tattoogallery/horsecartatt.jpg" alt='Carousel'/> 

    <img src="img/tattoogallery/lovefinger.jpg" alt='Love finger tatt'/> 

    <img src="img/tattoogallery/hakun.jpg" alt='Hakuna Matata'/> 

    <img src="img/tattoogallery/romannum.jpg" alt='Roman Numerals'/> 

    <img src="img/tattoogallery/slayer.jpg" alt='Slayer'/> 

    <img src="img/tattoogallery/shamrock.jpg" alt='Shamrock'/> 

    <img src="img/tattoogallery/scriptarm.jpg" alt='Script'/> 

    <img src="img/tattoogallery/skull.jpg" alt='Skull'/> 

    <img src="img/tattoogallery/wristfoot.jpg" alt='Wrist and Foot Tatts'/> 

    <img src="img/tattoogallery/zombieariel.jpg" alt='Zombie Ariel'/> 

    <img src="img/tattoogallery/script.jpg" alt='Script'/> 

    <img src="img/tattoogallery/chinese.jpg" alt='Chinese Symbols'/> 

    <img src="img/tattoogallery/colflower.jpg" alt='Flower'/> 

    <img src="img/tattoogallery/scriptfoot.jpg" alt='Foot Script Tatt'/> 

    <img src="img/tattoogallery/Triton.jpg" alt='Triton'/> 

    <img src="img/tattoogallery/zombiefingers.jpg" alt='Zombie Finger Tatt'/> 

    <img src="img/tattoogallery/tyler.jpg" alt='Script'/> 

    <img src="img/tattoogallery/3ursula.jpg" alt='Ursula'/> 

    <img src="img/tattoogallery/locket.jpg" alt='Locket'/> 

    <img src="img/tattoogallery/mechwing2.jpg" alt='Mechanical Wings'/> 

    <img src="img/tattoogallery/backscript.jpg" alt='Script'/> 

    <img src="img/tattoogallery/wingcolor.jpg" alt='Coloured Wing'/> 


    </div> 

</div> 


</div> 


<div id="gallback"> 

<h2> Make Up </h2> 

<div id="gallerywrap2"> 

    <div id='example2' class='container'> 
     <img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/> 

     <img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/> 

     <img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/> 

     <img src="img/tattoogallery/clown.jpg" alt='Clown'/> 

     <img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/> 

     <img src="img/tattoogallery/flouder.jpg" alt='Flounder'/> 

     <img src="img/tattoogallery/grenade.jpg" alt='Grenade'/> 

     <img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/> 



    </div> 

</div> 


</div> 



</div> 
</body> 

</html> 

在化妝部分下,我將它改名爲gallerwrap2下的Gallery2。對於無標題的例子,你應該打電話給$.monte('#example2');

+0

謝謝,它的工作原理!有些搞砸了佈局,但應該很容易分類。但是,有沒有理由在IE中不工作? – user1944305

+0

您使用的是哪個版本的IE?你有任何腳本錯誤? – kevingreen

+0

對不起!金髮時刻!我只記得我之前修復過它,我沒有關閉div,它在其他瀏覽器中工作,但不是IE。再次感謝 – user1944305