简体   繁体   English

JavaScript按钮无响应

[英]JavaScript Buttons Not Responding

I am having trouble getting JavaScript buttons to call functions on being clicked. 我无法让JavaScript按钮在被点击时调用函数。 I've tried multiple ways, but I think there must be some other issue in my code. 我尝试了多种方法,但是我认为代码中肯定还有其他问题。 Thanks for your help. 谢谢你的帮助。 I've messed around with different button features like the 'onclick' attribute, but nothing seems to work. 我弄乱了诸如“ onclick”属性之类的不同按钮功能,但似乎没有任何效果。 The code will launch an html page, but the buttons just don't do anything. 该代码将启动一个html页面,但是按钮什么也不做。 The functions just never get called, but I'm not sure exactly why. 这些函数永远不会被调用,但是我不确定为什么。

<!DOCTYPE html>
<html lang = "en">
<head>
    <meta charset="utf-8">
    <title>Test Tree</title>
</head>
<body>

<h1>Test Tree</h1>

<p id="question">Ready to start the tree?</p>

<! Below are the interactice elements>
<button id="nextYes()">Yes</button>
<button id="nextNo()">No</button>


<script type="text/javascript">
//window.alert("hello");
var decision_tree = [["Ready to start the tree?"],["Node 1"],["Node 1.1", "Node     1.2"],["Node 1.1.1", "Node 1.1.2", "Node 1.2.1", "Node 1.2.2"]];


// this is the location in the tree, used to determine next location
var i = 0;
var j = 0;

document.getElementById('y').addEventListener('click', nextYes);
document.getElementById('n').addEventListener('click', nextNo);

var y = document.getElementById('y');
var n = document.getElementById('n');

function nextYes() {
    window.alert("Yes!");

    i++;
    if (i==0) {
        document.getElementById('question').innerHTML = decision_tree[i][j];
    } else if (i < decision_tree.length-1) {
        j *= 2;
        document.getElementById('question').innerHTML = decision_tree[i][j];
    }
}

function nextNo() {

    if (i != 0 and i < decision_tree.length-1) {
        i++;
        j = j*2 + 1;
        document.getElementById('question').innerHTML = decision_tree[i][j];
    }
}
</script>

</body>
</html>

A couple errors there. 那里有几个错误。 I've shortened it to just the relevant parts. 我已将其简化为相关的部分。

You needed ids on your buttons. 您需要按钮上的ID。 Your js code can't locate them otherwise here: 您的js代码无法在此处找到它们:

var y = document.getElementById('y');
var n = document.getElementById('n');

Also, you already have those elements stored in var y and n, so no need to query them again when adding the event listeners. 此外,您已经将这些元素存储在var y和n中,因此在添加事件侦听器时无需再次查询它们。

 var decision_tree = [["Ready to start the tree?"],["Node 1"],["Node 1.1", "Node 1.2"],["Node 1.1.1", "Node 1.1.2", "Node 1.2.1", "Node 1.2.2"]]; // this is the location in the tree, used to determine next location var i = 0; var j = 0; var y = document.getElementById('y'); var n = document.getElementById('n'); y.addEventListener('click', nextYes); n.addEventListener('click', nextNo); function nextYes() { alert("Yes!"); } function nextNo() { alert("No"); } 
 <h1>Test Tree</h1> <p id="question">Ready to start the tree?</p> <! Below are the interactice elements> <button id="y">Yes</button> <button id="n">No</button> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM