评估语句中的按钮文本

Question

嗨，我试图在语句中评估按钮的textContent，但实际上什么也没发生。

我的HTML：

<div class="app">
    <h2 id="question"></h2>
    <button class="options" type="button" value="val"><span></span></button>
    <button class="options" type="button" value="val"><span></span></button>
    <button class="options" type="button" value="val"><span></span></button>
    <button class="options" type="button" value="val"><span></span></button>
    </br>
    <button id="submit" type="button" name="button">Submit</button>
    <button id="back" type="button" name="button">Back</button>
</div>

function evaluate() {
    // click the submit button
    submitBtn.addEventListener('click', function() {
        //check if the selected answer is correct
        for(i = 0; i < options.length; i++) {
            if(options[i].classList.contains('picked').textContent === 6) {
                alert('welldone')
            }
        }
    })
}

Answer 1

如果您尝试同时比较按钮的文本和类，则可以使用以下代码。 请注意，您使用的===也会比较数据类型，因此将6更改为'6'或将比较运算符从===更改为== 。 检查此链接以获取有关比较运算符的详细信息

  $(document).ready(function () { var submitBtn = document.getElementById("submit"); submitBtn.addEventListener('click', function () { //check if the selected answer is correct var options = document.querySelectorAll('.options'); for (i = 0; i < options.length; i++) { if (options[i].classList.contains('picked') && options[i].textContent === "6") { alert('welldone') } } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> <div class="app"> <h2 id="question"></h2> <button class="options picked" type="button" value="val"><span>6</span></button> <button class="options" type="button" value="val"><span></span></button> <button class="options" type="button" value="val"><span></span></button> <button class="options" type="button" value="val"><span></span></button> </br> <button id="submit" type="button" name="button">Submit</button> <button id="back" type="button" name="button">Back</button> </div>