Question

我正在尝试在点击时使用jQuery在内部和图像路径中设置变量。下面的模型函数设置文件夹变量，它将是图像路径中的文件夹名称。因此，单击按钮1的示例我希望将变量'folder'设置为'folder1'，这样当我单击一个颜色时，它将获取该文件夹的图像形式。我的问题是，当我选择一种颜色时，变量不会传递到路径中，而右路径会分配给图像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>

Answer 1

我认为您应该将'modal'变量名称更改为'folder'。转过来：

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

到这些：

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

Answer 2

关于变量范围，你必须删除文件夹变量的变量定义：因为这个定义改变了它的范围，卸妆＆＃39; var＆＃39;发短信并写下这些：

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

Answer 3

我删除了＆＃39; var＆＃39;从每个onclick事件中......

        folder = 'folder1';

修正：）

单击时将变量字符串添加到img src路径

3 个答案: