English 中文(简体)
更改头盔
原标题:Can t get javascript to modify a header

该守则应当要求用户提供意见,并根据提交的说明(正确的答案是“Aconcagua”)来退回不正确或正确。 在进行并提交答复时,均不将这些答复印在屏幕上。 我很抱着耳光和超音。

function wrong2()
                {
        document.querySelector( #2solution ).innerHTML = "Incorrect.";
        document.querySelector( #input ).style.backgrounColor =  red ;
}
function right2()
                {
        document.querySelector( #2solution ).innerHTML = "Correct!";
        document.querySelector( #input ).style.backgrounColor =  green ;
}

a = "Aconcagua";
document.querySelector( #form ).addEventListener( submit , function(event){
    if (document.querySelector( #input ).value.localeCompare(a) == 0)
    {
        right2();
    }
    else
    {
        wrong2();
    }

    event.preventDefault();
});
<div class="wrapper">
    <div class="header">
        <h1>Trivia!</h1>
    </div>
    <div class="section">
        <h2>Part 2: Free Response</h2>
        <hr>
        <h3>What is the highest mountain in South America?</h3>
        <form action="" id="form">
            <input id="input" type="text">
            <button id="b" type="sumbit">Submit</button>
        </form>
    </div>
    <h2 id="2solution"></h2>
</div>
最佳回答

这里是你守则的一个工作例子。 首先,在不开放“div”的情况下,可以关闭“/div”。 您还有一本关于背景调查的打字。 最好在你手法一开始(有时没有必要)时加以界定。 另外,还开放全页,在使用氮时看到有色背景。 除了这些错误之外,你的法典还可以发挥作用:

const form = document.querySelector( #form )
const solutionDisplay = document.querySelector( #solution )
const inputField = document.querySelector( #input )
console.log(inputField)
let a = "Aconcagua";

function wrong2(){
        solutionDisplay.innerHTML = "Incorrect.";
        inputField.style.backgroundColor =  red ;
}
function right2(){
        solutionDisplay.innerHTML = "Correct!";
        inputField.style.backgroundColor =  green ;
}


form.addEventListener( submit , function(event){
        if(inputField.value == a){
                right2();
        }
        else{
                wrong2()
        }
        event.preventDefault();
});
<div>
        <div class="header">
            <h1>Trivia!</h1>
        </div>
        <div class="section">
            <h2>Part 2: Free Response</h2>
            <hr>
            <h3>What is the highest mountain in South America?</h3>
            <form action="" id="form">
                <input id="input" type="text">
                <button id="b" type="sumbit">Submit</button>
            </form>
        </div>
        <h2 id="solution"></h2>
    </div>
问题回答

You re missing parentheses () which are necessary to call the functions. right2() and wrong2(). Without (), they are just treated as references to the functions rather than function calls.

更正代码:

<script>
    function wrong2() {
        document.querySelector( #2solution ).innerHTML = "Incorrect.";
        document.querySelector( #input ).style.backgroundColor =  red ;
    }

    function right2() {
        document.querySelector( #2solution ).innerHTML = "Correct!";
        document.querySelector( #input ).style.backgroundColor =  green ;
    }

    // Function for event listener
    function setUpEventListener() {
    a = "Aconcagua";
document.querySelector( #form ).addEventListener( submit ,function(event){
console.log("Input value:",document.querySelector( #input ).value);

if (document.querySelector( #input ).value === a) {
    right2(); // Correct answer
} else {
    wrong2(); // Incorrect answer
}
event.preventDefault();
});
    }

    // Ensure the event listener is set up after the form element exists
    document.addEventListener("DOMContentLoaded", function () {
        setUpEventListener();
    });
</script>

DOMContent 只有在超文本页面完全平时,才发生失控火灾,因此,确保了你在事件发生前的装上了表格。





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签