Question

我想根据用户点击的内容在两个文件夹之间进行选择。我需要在java脚本中实现它...因为它的另一个长代码的虚拟代码。如果用户选择'Folder1' - ＆gt;文件夹1 如果用户选择'Folder2' - ＆gt;文件夹2

我不知道如何实现它。

        <style type="text/css">
            body {
                background-color: #000000;
                margin: 0;
                overflow: hidden;
                font-family: Arial, Helvetica, sans-serif;
            }



            #box {
    width: 200px;
    height: 200px;
    background-color: red;
}


        </style>
    </head>
    <body>


        <h2>Spectacular Mountain</h2>
<img src="folder1/1.png" alt="Mountain View" style="width:304px;height:228px;">

        <div id='box'></div>
        <div id='buttons'>
         <button id='Fl1'>Folder1</button>
        <button id='Fl2'>Folder2</button>
        </div>



        <script type="text/javascript">

var box = document.getElementById('box');

document.getElementById('buttons').addEventListener('click', function (evt) {
    var target = evt.target;
    var folderid=1;// to initiat
    if (target.id === 'Fl1') {
        box.style.backgroundColor = 'red';
        // DUMMY 2 understand what I want
        I need to get name of folder
    folderid=1;
    } else if (target.id === 'Fl2') {
        box.style.backgroundColor = 'green';
        // DUMMY 2 understand what I want
        folderid=2;
    } else {
        box.style.backgroundColor = 'purple';
    }
}, false);

// How CAN I write folder name and display image

        </script>

    </body>
</html>

Answer 1

您应该使用target.getAttribute('id')代替target.id来获取属性值：

var box = document.getElementById('box');

document.getElementById('buttons').addEventListener('click', function (evt) {
  var target = evt.target;
  var folderid=1;// to initiat

  if (target.getAttribute('id') === 'Fl1') {
    box.style.backgroundColor = 'red';
    // DUMMY 2 understand what I want I need to get name of folder
    folderid=1;
  } else if (target.getAttribute('id') === 'Fl2') {
    box.style.backgroundColor = 'green';
    // DUMMY 2 understand what I want
    folderid=2;
  } else {
    box.style.backgroundColor = 'purple';
  }
}, false);

演示：https://jsfiddle.net/0ngsdzx2/

通过单击事件选择文件夹名称

1 个答案: