Question

我有以下HTML。我想找到点击的项目。例如：如果我点击了ups，o / p就应该像那样。我已经写了像这样但没有得到我需要的东西。这会返回所有文字。

 $('.sentiment-text .text').on('click',function(e) {
    var str = $('.sentiment-text .text').find('span').text();
    alert(str);
 });

以下是我正在尝试的HTML代码。在我编写完上述代码之后我得到了全文但是没有得到我点击的项目

<div class="sentiment-text">
                <div class="wrapper">
                    <div class="key"></div>

            <div class="text" style="cursor: pointer;"><div class="tags alert-success"><a href="#" class="close" data-dismiss="alert">×</a>
                <span class="noun">Thumbs</span> 
                <span class="adverb">up</span>
                 <span class="verb">ups</span>
        <span class="verb">down</span>
            </div>
            </div>

            <div class="clear-sentiment"></div>

            </div>
            </div>

Answer 1

您需要将this用于上下文，并将span定位到选择器本身。

$('.sentiment-text .text span').on('click',function(e) {
    var str = $(this).text();
    alert(str);
});

DEMO

Answer 2

所以更确切地说，将处理程序放在div上为什么不在.text内定位跨度并报告文本

＆＃13;

$('.text span').on('click', function(e) {
  var str = $(this).text();
  alert(str);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="sentiment-text">
  <div class="wrapper">
    <div class="key"></div>

    <div class="text" style="cursor: pointer;">
      <div class="tags alert-success"><a href="#" class="close" data-dismiss="alert">×</a>
        <span class="noun">Thumbs</span> 
        <span class="adverb">up</span>
        <span class="verb">ups</span>
        <span class="verb">down</span>
      </div>
    </div>

    <div class="clear-sentiment"></div>

  </div>
</div>

＆＃13;

Answer 3

使用以下：

$('.text span').on('click', function() {
  alert($(this).text());
});

Answer 4

试试这个：

$('.sentiment-text .text').find('span').on('click',function(e) {
    var str = $(this).text();
    alert(str);
});

Answer 5

$('.sentiment-text span').on('click',function(e) {
        var str = $(this).text();
        alert(str);
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="sentiment-text">
                <div class="wrapper">
                    <div class="key"></div>

            <div class="text" style="cursor: pointer;"><div class="tags alert-success"><a href="#" class="close" data-dismiss="alert">×</a>
                <span class="noun">Thumbs</span> 
                <span class="adverb">up</span>
                 <span class="verb">ups</span>
        <span class="verb">down</span>
            </div>
            </div>

            <div class="clear-sentiment"></div>

            </div>
            </div>

Answer 6

I have solved this way

$('.sentiment-text span').live('click',function(e) {
    var str = $(this).text();
    alert(str);
});

请注意，将'on'更改为'live'。我知道它在Jquery 1.7中被弃用了。但对我来说别无他法。

使用jquery从span中查找单击的项目

6 个答案: