Question

我试图让我的fizzbuzzz解决方案在“点击”上运行并显示在容器中的代码标签之间，但是当我在div中单击并且我无法找出原因时没有打印出来。

我的功能是：

function fizzbuzz(){
    for (var i = 1; i < 101; i++){
        if ((i % 15) === 0) {
            console.log('FizzBuzz');
            } else if ((i % 3) === 0){
            console.log('Fizz');
            } else if ((i % 5) === 0){
            console.log('Buzz');
            } else {
            console.log(i);
            }
        }
    }

对于我的index.html视图我有这个：

  <div id="results" class="container text-center">
    <p>Click to view the results of the function we just wrote: </p>
    <code></code>
  </div>

对于我的jQuery脚本，我有：

$("#results").click(function() {
  fizzbuzz();
});

我做错了什么？我将非常感谢任何反馈：）

Answer 1

.onClick错了。请改用.click :( http://api.jquery.com/click/）

$("#results").click(function() {
  fizzbuzz();
});

Answer 2

嗯，<code>标签没有特殊含义，你所做的一切都不会把代码放在那里。您可能正在寻找的东西更接近于此：

<div id="results" class="container text-center">
    <p>Click to view the results of the function we just wrote: </p>
    <span id="fizzbuzz"></span>
</div>

功能：

$(document).ready(function() {
function fizzbuzz(){
    elt = $('#fizzbuzz'); // find the element
    elt.empty(); // clear out anything that's there already
    for (var i = 1; i < 101; i++){
        if ((i % 15) === 0) {
            elt.append('FizzBuzz'); // append text
            } else if ((i % 3) === 0){
            elt.append('Fizz');
            } else if ((i % 5) === 0){
            elt.append('Buzz');
            } else {
            elt.append(i);
            }
        elt.append(" "); // add a space
        }
    }

$("#results").click(function() { // use .click(... or .on('click'..., not .onClick
  fizzbuzz();
});
});

Answer 3

或者你可以尝试

$("#results").on('click', function() {
    fizzbuzz();
});

Answer 4

如果失败，你可以试试：

$("#results").bind('click', function() {
    fizzbuzz();
});

jQuery事件处理程序不会在单击时激活

4 个答案: