JQuery - 单击特定文本的事件？

Question

<!DOCTYPE html>
<html>
  <head>
    <script src="jquery.js"></script>
    <script src="data_generator.js"></script>
    <title> Twiddler </title>
  </head>
<body class='box'>
  <body>
    <div class='container'>
      <h1 class='title'>My Twiddler</h1>
    <div class='main'>
      <h2>Tweet Feed</h2>
      <p class='tweets'></p>
      <p class='new'></p>
      <button class='button'>New Tweets</button>
     </div>
    </div>

    <script>
      $(document).ready(function(){
        var $body = $('.main');

        var index = streams.home.length - 1;
        while(index >= 0){
          var tweet = streams.home[index];
          var $tweet = $('<p></p>');

          $tweet.text('@' + tweet.user + ': ' + tweet.message + tweet.created_at);
          $tweet.appendTo('.tweets');
          index -= 1;
        }

        //show new tweets using button
        var $button = $('.button');
        $button.click(function() {
          //get random tweet
          //streams.home is an array of all tweets of all users
          var tweet = streams.home[Math.floor(Math.random() * streams.home.length)]
          var $tweet = $('<p></p>');
          $tweet.text('@' + tweet.user + ': ' + tweet.message + tweet.created_at);
          $tweet.appendTo('.tweets');
        })

        //click on user to see tweet history
        $body.click(function() {

        })

        //styling
        $('.box').css("background-image", "url('https://www.rightmixmarketing.com/wp-content/uploads/2016/04/Twitter-Background.png')");
        $('.title').css('font-size', '40px').css('text-align', 'center');
        $('h2').css('text-align', 'center');
      });

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

I'm making a twitter look a like.我正在让推特看起来像。 I am trying to show a users history by being able to click on the username and displaying all current tweets.我试图通过能够单击用户名并显示所有当前推文来显示用户历史记录。 How can I go about and do this?我该怎么做才能做到这一点？ I have it set to click on the body of my text but obviously that is not the right way.我已将其设置为单击文本正文，但显然这不是正确的方法。 How can I specifically target the username in this case?在这种情况下，我如何专门针对用户名？ I attached a picture of my current html我附上了我当前 html 的图片

Answer 1

How to register the event clicking just on 'username' part of the text?如何注册仅单击文本的“用户名”部分的事件？

Consider the following:考虑以下：

<p>
    <a class='click-me' >Username</a>
    There is a lot of text here. 
    There's some more text here. I want to be able to click ...
</p>

So you just need to wrap the username in an html element which has a certain class.因此，您只需要将用户名包装在具有特定类的 html 元素中。

Then, you specify a listener for the click event on that class:然后，您为该类上的 click 事件指定一个侦听器：

$('.click-me').on('click', function() {
    //do something
});

Now, you probably need to know which username we're talking about and how to get the specific posts, for that there are other solutions.现在，您可能需要知道我们谈论的是哪个用户名以及如何获取特定帖子，因为还有其他解决方案。 But this one answers your question in specific.但这一个具体回答了您的问题。

JQuery - 单击特定文本的事件？

问题描述

1 个解决方案

解决方案1
0 2020-03-15 01:39:09

JQuery - 单击特定文本的事件？

问题描述

1 个解决方案

解决方案1 0 2020-03-15 01:39:09

解决方案1
0 2020-03-15 01:39:09