Question

我想创建类似this

的内容

我需要使用JS / jQuery创建它吗？它会是什么样子？任何代码片段，请.. 例如，当我选择1b时，它将返回1个图像，当2a时它将返回其他图像

1 2 3

一 b ç

更新：

  <script>

    //returning frame data att
    $(document).ready(function() {
    $(function(){
        $('.frame').click(function(){
            alert($(this).data("frame"));
            });
        });
    }); 


    //returning roof data att
    $(document).ready(function() {
    $(function(){
        $('.roof').click(function(){
            alert($(this).data("roof"));
            });
        });
    }); 



    </script>

    <h3>Frame</h3>
    <a href="#" class="frame" data-frame="1">Blue</a><br/>
    <a href="#" class="frame" data-frame="2">Red</a><br/>
    <a href="#" class="frame" data-frame="3">Green</a><br/>
    <a href="#" class="frame" data-frame="4">Purple</a>


    <h3>Roof</h3>  

    <a href="#" class="roof" data-roof="1">Clear</a><br/>
    <a href="#" class="roof" data-roof="2">Moodust</a><br/>
    <a href="#" class="roof" data-roof="3">Yellow</a><br/>

现在我有警报，已点击了哪个框。现在我需要将它们分组。例如，当我点击蓝色框时，它将选择蓝色，当我点击清除时，它将被选中，并显示图像1_1.jpeg的输出，或类似的东西

小提琴 - http://jsfiddle.net/antonoff/pPvmy/

Answer 1

您可以将图片网址设为：http://jsfiddle.net/pPvmy/1/

在此代码中，imageurl是您的网址...

var framechoice = '';
var roofchoice='';

$(document).ready(function() {
        $(function(){
            $('.frame').click(function(){
                alert($(this).data("frame"));
                framechoice = $(this).data("frame");
                });
            });
        }); 

        $(document).ready(function() {
        $(function(){
            $('.roof').click(function(){
                alert($(this).data("roof"));
                roofchoice = $(this).data("roof");

                if( framechoice !='' && roofchoice != '')
                {
                    var imageurl = 'image'+ framechoice +'_'+roofchoice+'.jpg';
                    alert(imageurl);
                }

                });
            });
        });

小项目列表模板

1 个答案: