添加可变字符串到img src路径点击

我试图设置一个变量里面和图像路径使用jQuery点击。下面的模型函数设置文件夹变量，它将成为图像路径中的文件夹名称。所以点击按钮1的例子，我想变量'文件夹'被设置为'folder1'，所以当我点击一种颜色时，它需要该图像形式的文件夹。我的问题是，当我选择一种颜色时，变量不会传递到路径中，而正确的路径会分配给图像src。添加可变字符串到img src路径点击

jQuery的...

var folder = ''; 

//MODELS 


$(function() { 
$('.folder1').click(function(){ 
    var folder = 'folder1'; 
    $(".selected-car").attr('src',"img/folder1/pic1.jpeg"); 
    return false; 
}); 
$('.folder2').click(function(){ 
    var folder = 'folder2'; 
    $(".selected-car").attr('src',"img/folder2/pic1.jpeg"); 
    alert(model); 
    return false; 
}); 
$('.folder3').click(function(){ 
    var folder = 'folder3'; 
    $(".selected-car").attr('src',"img/folder3/pic1.jpeg"); 
    return false; 
}); 
$('.folder4').click(function(){ 
    var folder = 'folder4'; 
    $(".selected-car").attr('src',"img/folder4/pic1.jpeg"); 
    return false; 
}); 
}); 


//COLOURS 

$(function() { 


    $('.colour1').click(function(){ 
     $(".selected-car").attr('src',"img/"+folder+"/cooper1.jpeg"); 
     return false; 
    }); 
    $('.colour2').click(function(){ 
     $(".selected-car").attr('src',"img/"+folder+"/cooper2.jpeg"); 
     return false; 
    }); 

});

HTML ...

    <div class="select-model"> 

         <button class="folder1">model 1</button> 
         <button class="folder2">model 2</button> 
         <button class="folder3">model 3</button> 
         <button class="folder4">model 4</button> 

        </div> 

        <div class="configuration clearfix"> 

         <img src="img/folder1/pic6.jpeg" class="selected-car"><!-- default pic --> 

         <div class="select-colour clearfix"> 
          <a href="#"><img src="img/colour/colour1.jpeg" class="colour1"></a> 
          <a href="#"><img src="img/colour/colour2.jpeg" class="colour2"></a> 
          <a href="#"><img src="img/colour/colour3.jpeg" class="colour3"></a> 
          <a href="#"><img src="img/colour/colour4.jpeg" class="colour4"></a> 
          <a href="#"><img src="img/colour/colour5.jpeg" class="colour5"></a> 
          <a href="#"><img src="img/colour/colour6.jpeg" class="colour6"></a> 
          <a href="#"><img src="img/colour/colour7.jpeg" class="colour7"></a> 
          <a href="#"><img src="img/colour/colour8.jpeg" class="colour8"></a> 
          <a href="#"><img src="img/colour/colour9.jpeg" class="colour9"></a> 
          <a href="#"><img src="img/colour/colour10.jpeg" class="colour10"></a> 
         </div> 
        </div>

来源

2014-10-16 Amesey

而你所遇到的问题是...？ – j08691 2014-10-16 15:36:08

对不起...我的问题是，当我选择一种颜色时，变量不会被传递到路径中，而正确的路径会被分配给图像src。 – Amesey 2014-10-16 15:39:26

你的文件夹变量在哪里分配了一个值？ – j08691 2014-10-16 15:41:36

我想你应该改变 '模式' 变量名 '文件夹'。把这些：

var model = 'folder1'; 
var model = 'folder2'; 
var model = 'folder3'; 
var model = 'folder4';

这些：

var folder = 'folder1'; 
var folder = 'folder2'; 
var folder = 'folder3'; 
var folder = 'folder4';

来源

2014-10-16 15:44:45

对不起，我已经在我的代码中做了这个，我只是为了正确编辑这个脚本 – Amesey 2014-10-16 15:52:30

我已经编辑上面的代码，感谢您的发现。这样的代码，它目前不起作用 – Amesey 2014-10-16 15:53:32

这是所有关于变量的作用域，您必须删除的文件夹变量变量定义：监守这个定义改变它的范围，卸妆“变种”的文字和写这些：

folder = 'folder1'; 
folder = 'folder2'; 
folder = 'folder3'; 
folder = 'folder4';

来源

2014-10-16 16:06:48

我从每个onclick事件中删除了“变种” ......

 folder = 'folder1';

固定:)

来源

2014-10-16 16:06:52 Amesey

添加可变字符串到img src路径点击

回答

相关问题