jquery与按钮onclick函数

我刚刚开始web开发，并有一个函数loadTweets从另一个文件中拉出并显示，当我摆脱按钮，并直接运行它作为一个匿名函数，它的工作原理，但是，由于某些原因，按钮无法调用该函数。jquery与按钮onclick函数

任何帮助将不胜感激，谢谢！

<html> 
    <head> 
    <script src="jquery.js"></script> 
    <script src="data_generator.js"></script> 

    </head> 
    <button type = "button" onclick="loadTweets"> Load </button> 
    <body> 
    <script> 
     $(document).ready(function(){ 
     var loadTweets = function(){ 
      var $body = $('body'); 
      $body.html(''); 
      var index = streams.home.length - 1; 
      while(index >= 0){ 
      var tweet = streams.home[index]; 
      var $tweet = $('<div></div>'); 
      $tweet.text('@' + tweet.user + ': ' + tweet.message); 
      $tweet.appendTo($body); 
      index -= 1; 
      } 
     } 
     }); 
    // }); 



    </script> 
    </body> 
</html>

来源

2017-05-05 user3628240

调用你的函数类似这样的<按钮类型=“按钮”的onclick =“loadTweets（）”>加载 –

您需要定义文档准备处理以外的功能和使用()与功能

<button type = "button" onclick="loadTweets()"> Load </button> 

<script> 
    var loadTweets = function(){ 
     // 
    }); 
</script>

不过我建议你用不显眼的事件处理程序。

HTML，一个ID属性添加到按钮

<button type="button" id="loadTweets"> Load </button>

脚本，然后使用ID selector靶向元件和.on()到事件处理程序结合。

$(document).ready(function() { 
    var loadTweets = function() { 
     //existing code 
    } 

    $('#loadTweets').on('click', loadTweets) 
});

来源

2017-05-05 06:03:14 Satpal

所以从我的理解文档就绪处理程序在页面加载后运行，那么为什么在第一个示例中您是否在其外部定义了loadTweets？ – user3628240

@ user3628240，'loadTweets'需要在全局范围内，那么只有它可以通过'onclick'访问，你可以测试你自己 – Satpal

可以以另一种方式使用

<html> 
    <head> 
    <script src="jquery.js"></script> 
    <script src="data_generator.js"></script> 

    </head> 
    <body> 
    <button type = "button" onclick="loadTweets()"> Load </button> 
    <script> 
     function loadTweets(){ 
      var $body = $('body'); 
      $body.html(''); 
      var index = streams.home.length - 1; 
      while(index >= 0){ 
      var tweet = streams.home[index]; 
      var $tweet = $('<div></div>'); 
      $tweet.text('@' + tweet.user + ': ' + tweet.message); 
      $tweet.appendTo($body); 
      index -= 1; 
      } 
     } 
    </script> 
    </body> 
</html>

来源

2017-05-05 06:05:12

jquery与按钮onclick函数

回答

相关问题