如何在js，jquery，html中创建适当的click事件

Question

因此，作为一项任务，我需要创建一个准系统的Twitter克隆。 我得到了一个脚本，该脚本可以从四个用户创建随机推文，并且要显示它们，我只是在使用一个间隔。 我的问题是，其中一种条件要求，如果用户单击用户名之一，则网站应显示用户的推文历史记录。 这些推文都存储在生成器文件中。 实际上，我已经尝试了一天多的时间来运行动态点击脚本。 每当我在网站上附加一条推文时，都会使用一类用户名。 就逻辑而言，我得到的最接近的结果是将onclick = functionName（userclass）放在我的用户名的锚点内。 但这超出了范围。 我是html / jquery的新手。 实际上，这是我的第一个星期，所以我已经阅读了几个小时，并且大家都知道当您开始学习这些东西时情况如何。 您阅读的内容越多，所提出的问题就越多。 希望有人可以发光

这是代码：

<!DOCTYPE html> <html>   <head>

    <title>TWIDDLER</title>
    <link rel="stylesheet" href="style.css">
    <script src="jquery.js"></script>
    <script src="data_generator.js"></script>
    <script src="history.js"></script>   </head>

  <body>
    <img class="bird" src="icon.png">
    <h1>
      <span class='title' id="top">TWIDDLER (def not Twitter)</span>
    </h1>

    <script>
      $(document).ready(function(){
        var $body = $('.tweets');
        var index = 0;
        setInterval(function(){
          var tweet = streams.home[index];
          var $tweet = $('<div></div>');
          var hypername = tweet.user; 
          var $username = $("<a onclick='gethistory("+hypername+")' href='#top' class='"+hypername+"'><span></span></a>");
          var $endline = $('<br>');
          console.log($username);
          var time = tweet.created_at.toLocaleTimeString();
          $tweet.text(tweet.message + ' | ' + tweet.created_at.toLocaleTimeString());
          $username.text('@' + tweet.user + ': ');
          $username.appendTo($body)
          $tweet.appendTo($body);
          // console.log($tweet);
          // var testname = $('<h6></h6>').text('***'+hypername+'***').appendTo($body);
          $endline.appendTo($body);
          index += 1;
        }, 2000);
         var gethistory = function(name) {
           console.log("I clicked it");
          for (var i = 0; i < streams.users[name].length; i++) {
            var tweethist = streams.users[name][i];
            var $tweethist = $('<div></div>');
            var $endline = $('<br>');
            $tweethist.text(tweet.message + ' | ' + tweet.created_at.toLocaleTimeString());
            $tweethist.appendTo('#history');
            $endline.appendTo('#history');
          }
        };
      });
    </script>

    <h3>
    <section class="row">

        <div class="column1 tweets left"><h2>Tweeds</h2></div>

        <div class="column2 right" id="history"></div>

    </section>
    </h3>

    <!-- <section>
      <audio controls autoplay src="song.mp3"></audio>
    </section> -->

  </body>

</html>

Answer 1

@Imsuchacoder

您的代码对HTML DOM和Javascript变量范围了解甚少。 开发人员可能会发现您的问题“需要解释很多”。

（1）。 您必须对HTML结构有一个很好的了解。 了解有关DOM的信息： https : //en.wikipedia.org/wiki/Document_Object_Model和https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction

如果您编写不正确，浏览器将无法正常运行。

（2）。 您的代码无法正常工作，因为在尝试从全局范围访问gethistory它位于本地范围内。 尝试在全局范围内定义函数gethistory 。

在此处了解有关变量范围的更多信息： https : //www.w3schools.com/js/js_scope.asp以及此处JavaScript中变量的范围是什么？

如何在js，jquery，html中创建适当的click事件

问题描述

1 个解决方案

解决方案1
-1 2019-12-01 01:17:47

如何在js，jquery，html中创建适当的click事件

问题描述

1 个解决方案

解决方案1 -1 2019-12-01 01:17:47

解决方案1
-1 2019-12-01 01:17:47