javascript - 如何编写一个 if else 语句引用在javascript中单击了哪个按钮（多个）

问题描述

我正在写一个多项选择测验。就目前而言，我已经设法确定用户单击了哪个按钮。我现在正在尝试根据该信息编写 if else 语句。每个问题都有一个不同的按钮代表正确的答案，所以理想情况下，我想要“如果按钮的 id 被点击！== 正确，这个，否则这个”。我提供了一些代码，让您了解我要尝试的地方。所有帮助表示赞赏！

//h1 will display the questions
var quiz = [
    //quiz questions and potential answers here in this array
    Question1 = {
        question: "this is question 1",
        //these will probably be changed into buttons
        answer1: "wrong answer",
        answer2: "wrong answer",
        answer3: "right answer",
        answer4: "wrong answer",
        correct: "answer3"
        
    },
    Question2 = {
        question: "this is question 2",
        //these will probably be changed into buttons
        answer1: "wrong answer",
        answer2: "right answer",
        answer3: "wrong answer",
        answer4: "wrong answer",
        correct: "answer2"

for (var i = 0; i < allButtons.length; i++) {
            allButtons[i].addEventListener("click", function() {
                console.clear();
                console.log("you clicked: ", this.innerHTML);
            });

作为参考，在这种情况下，“answer1”、“answer2”等对应于按钮的 id

标签： javascriptbuttonclick

因此，据我了解您的情况，您希望根据问题动态生成一些按钮，对吗？我已经设法构建了这样的东西，我不知道这是否可以解决你的问题，至少它可以给你一些见解......

所以基本上我们有一个简单的 HTML 文档，它只包含一个根 div 和问题，问题是硬编码的，但关注 JS 部分背后的逻辑：

<body>
    <div id="root">
      <h1>Which one is the blablablababla?</h1>
    </div>
    <script src="index.js"></script>
  </body>

这就是我们根据我们提供的信息生成按钮的方式，您可以在这个数组中添加问题，或者创建一个对象并给它两个数组，一个包含问题，另一个包含答案：

const buttonsInfo = [
  { name: 'answer one', type: 'wrong answer' },
  { name: 'answer two', type: 'wrong answer' },
  { name: 'answer three', type: 'right answer' },
  { name: 'answer four', type: 'wrong answer' },
];

const generateButton = (arrayOfButtons) => {
  const buttons = arrayOfButtons.map((item) => {
    const button = document.createElement('BUTTON');
    button.innerHTML = item.name;
    button.addEventListener('click', () => {
      console.log(item.type);
    });
    return button;
  });
  return buttons;
};

const generatedButtons = generateButton(buttonsInfo);
const root = document.getElementById('root');

for (let i = 0; i < generatedButtons.length; i++) {
  root.appendChild(generatedButtons[i]);
}

javascript - 如何编写一个 if else 语句引用在javascript中单击了哪个按钮（多个）

问题描述

解决方案

推荐阅读