jQuery隐藏/显示问题

我有一个问题，我正在显示一辆汽车，我希望用户能够更改汽车的颜色以及轮辋。jQuery隐藏/显示问题

 <script type="text/javascript"> 
      function showImage(image){ 
       var mainImage = document.getElementById('mainImage'); 
       mainImage.src = image; 
      } 
      function toggleThumbnails(){ 
       var thumbnails = document.getElementById('color-options'); 
       if(thumbnails.style.display == 'block'){ 
       thumbnails.style.display = 'none'; 
       } else { 
       thumbnails.style.display = 'block'; 
       } 
      } 

       function showImage(image){ 
       var mainImage = document.getElementById('mainwheelImage'); 
       mainImage.src = image; 
      } 
      function toggleThumbnails(){ 
       var thumbnails = document.getElementById('wheel-options'); 
       if(thumbnails.style.display == 'block'){ 
       thumbnails.style.display = 'none'; 
       } else { 
       thumbnails.style.display = 'block'; 
       } 
      } 
     </script> 

<section id="footer-wrapper"> 
       <!-- Color Selector --> 
       <div id="color-options"> 
        <h1>Colors</h1> 
        <div class="color-container"> 
         <div class="color-center"> 
          <span><img src="img/colors/black.png" onclick="showImage('img/colors/cars/black.png')" /></span> 
          <span><img src="img/colors/white.png" onclick="showImage('img/colors/cars/white.png')" /></span> 
          <span><img src="img/colors/red.png" onclick="showImage('img/colors/cars/red.png')" /></span> 
          <span><img src="img/colors/silver.png" onclick="showImage('img/colors/cars/silver.png')" /></span> 
          <span><img src="img/colors/metalic_black.png" onclick="showImage('img/colors/cars/metalic_black.png')" /></span> 
          <span><img src="img/colors/metalic_grey.png" onclick="showImage('img/colors/cars/metalic_grey.png')" /></span> 
         </div> 
        </div> 
       </div> 
       <!-- /Color Selector --> 
       <div class="divider"></div> 
       <!-- Wheels Selector --> 
       <div id="wheel-options"> 
        <h1>Wheels</h1> 
        <div class="wheel-container"> 
         <div class="wheel-center"> 
          <span><img src="img/wheels/17.jpg" onclick="showImage('img/wheels/cars_overlay/17.png')" /></span> 
          <span><img src="img/wheels/18.jpg" onclick="showImage('img/wheels/cars_overlay/18_regular.png')" /></span> 
          <span><img src="img/wheels/18_twin.jpg" onclick="showImage('img/wheels/cars_overlay/18_twin.png')" /></span> 
          <span><img src="img/wheels/18_twin_7spoke.jpg" /></span> 
         </div> 
        </div> 
       </div> 
       <!-- /Wheels Selector -->

因此，切换汽车的颜色以及轮辋。但是如果我选择一种颜色，那么当我去选择一个边框时，颜色会默认回到原始图像。有没有什么办法在选择轮辋时选择颜色？

来源

2012-07-30 shayward

你声明'showImage'和'toggleThumbnails'功能的两倍。尝试给他们不同的名字。 – hradac 2012-07-30 20:05:38

您对不同的函数使用了相同的函数名两次，并且使浏览器混淆不清。尝试改变函数名类似：

function changeColor() 
function toggleColorThumbnails()

和

function changeRim() 
function toggleRimThumbnails()

来源

2012-07-30 20:10:18

jQuery隐藏/显示问题

回答

相关问题