1

我需要一些关于 jQuery 的帮助：

HTML

    <div id="container">
     <div class="flexslider woodslider"> 
      <ul id="woods" class="slides">
        <li><img src="products/drewno/dab/1.jpg" /></li>
        <li><img src="products/drewno/teak/2.jpg" /></li>
        <li><img src="products/drewno/sosna/3.jpg" /></li>
        <li><img src="products/drewno/dab/2.jpg" /></li>
        <li><img src="products/drewno/teak/1.jpg" /></li>
      </ul>
     </div>

      <div class="flexslider woodslider"> 
      <ul id="hands" class="slides">
        <li><img src="products/drewno/teak/1.jpg" /></li>
        <li><img src="products/drewno/teak/2.jpg" /></li>
        <li><img src="products/drewno/teak/3.jpg" /></li>
        <li><img src="products/drewno/teak/2.jpg" /></li>
        <li><img src="products/drewno/teak/1.jpg" /></li>
      </ul>
     </div>

       <div class="flexslider woodslider"> 
      <ul id="decors" class="slides">
        <li><img src="products/drewno/sosna/1.jpg" /></li>
        <li><img src="products/drewno/sosna/2.jpg" /></li>
        <li><img src="products/drewno/sosna/3.jpg" /></li>
        <li><img src="products/drewno/sosna/2.jpg" /></li>
        <li><img src="products/drewno/sosna/1.jpg" /></li>  
      </ul>
     </div> 
    </div>

    <!-- empty holder for dynamic image. -->
    <div id="rightside">
    <img src="" />
    </div>

JavaScript

$(window).load(function(e) {

      // image selected in first ul tag  
      var currentWood = $('#woods li img');
      currentWood.click(function(){

        // Get name of current clicked image
        var src = $(this).attr('src');  // full path
        var tarr = src.split('/');      //split path
        var file = tarr[tarr.length-2]; //get part of path
        var nums = tarr[tarr.length-1];
        var data = file.split('.')[0];  

        // last ul tag 
        // iterate over all images, and change path ( directory name - currentWood )

        $('#decors li img').each(function(){

          // this is problematic.
          // Images have got proper path ( dir name) but all have the same 
          // extension (n.jpg)
          $(this).attr('src', 'products/drewno/'+data+'/'+nums);  
          $(this).each(function() {
          var woodColor = $(this).attr('src');
          $('#rightside img').attr('src', woodColor);
          ///alert ($(this).attr('src'));
          });
        });       
      });// End of getting wood color info  
    }); // End of document ready

我想要的只是单击第一个#woods ul标签上的图像，获取该图像的路径（我需要大多数目录名称（dab、teak 或 sosna）并在图像中使用这部分目录名称 #decors ul img.

大部分已完成，但 中的图像#decors ul都具有相同的文件编号。如何将变量 nums 更改为当前文件的点击数#woods img？

4

0 回答 0