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

Question

I am writing a multiple choice quiz.我正在写一个选择题测验。 As it stands now, I have managed to identify which button is clicked by the user.就目前而言，我已经设法确定用户单击了哪个按钮。 I'm now trying to write an if else statement based on that information.我现在正在尝试根据该信息编写一个 if else 语句。 Each question will have a different button represent the right answer, so ideally I'd like something like "if id of button clicked !== correct, this, else this."每个问题都有一个不同的按钮代表正确的答案，所以理想情况下，我想要类似“如果点击按钮的 id ！== 正确，这个，否则这个。” I've provided some of the code to give you an idea of where I'm trying to go with this.我已经提供了一些代码，让您了解我正在尝试去哪里。 All help appreciated!所有帮助表示赞赏！

//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);
            });

For reference, in this case, "answer1," answer2," etc correspond with the ids of the buttons作为参考，在这种情况下，“answer1”、“answer2”等对应于按钮的 id

Answer 1

So, as far as I understand your situation, you want to generate some buttons dynamically which depens on the question, right?因此，据我了解您的情况，您想根据问题动态生成一些按钮，对吗？ I've managed to built something like this, I don't know if this could solve your problem, at least it can give you some insights...我已经设法构建了这样的东西，我不知道这是否可以解决您的问题，至少可以给您一些见解......

So basically we've got a simple HTML document, which includes only a root div and the question, the question is hardcoded but focus on the logic behind in the JS part:所以基本上我们有一个简单的 HTML 文档，它只包含一个根 div 和问题，问题是硬编码的，但关注 JS 部分背后的逻辑：

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

And this is how we generate buttons depens on information we give it, you can add questions in this array or maybe create an object and give it two arrays one contains questions and other the answers:这就是我们根据我们提供的信息生成按钮的方式，您可以在此数组中添加问题，或者创建一个对象并为其提供两个数组，一个包含问题，另一个包含答案：

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]);
}

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

问题描述

1 个解决方案

解决方案1
0 2020-09-26 23:49:46

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

问题描述

1 个解决方案

解决方案1 0 2020-09-26 23:49:46

解决方案1
0 2020-09-26 23:49:46