JQuery - событие клика для указанного c текста? - PullRequest
1 голос
/ 15 марта 2020
<!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>

Я делаю твиттер похожим. Я пытаюсь показать историю пользователей, нажав на имя пользователя и отображая все текущие твиты. Как я могу go о и сделать это? Я установил его, чтобы щелкнуть текст моего текста, но, очевидно, это не правильный путь. Как я могу конкретно указать имя пользователя в этом случае? Я приложил фотографию моего текущего html

enter image description here

1 Ответ

0 голосов
/ 15 марта 2020

Как зарегистрировать событие, щелкнув только по текстовой части 'username'?

Примите во внимание следующее:

<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>

Так что вам просто нужно заключить имя пользователя в html элемент, который имеет определенный класс.

Затем вы указываете прослушиватель для события click для этого класса:

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

Теперь вам, вероятно, нужно знать, с каким именем пользователя мы говорим о и как получить указанные c сообщения, для этого есть другие решения. Но этот ответ на ваш вопрос в конкретном c.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...