Question

我需要使用jquery从多个重复的HTML结构中检索媒体div上的click事件的文本信息。

<div class="activity-list">
    <div class="media">
        <a class="pull-left" href="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png">
            <img class="media-object" src="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png" alt="">
        </a>
        <div class="media-body">
            <a target="_blank" class="pull-left" href="https://twitter.com/Ford Motor Company">
                <strong>Ford Motor Company  @Ford</strong>
            </a>
            <br>
            <small class="text-muted">06-02-2015 05:53 PM</small>
            <small data-original-title="Favorite" data-toggle="tooltip" class="text-muted favorite"><i class="glyphicon glyphicon-star"></i>0</small>
            <div class="fb_desc">
                "@Barsotta Happy 100,000 miles, Justin! Here's to your next milestone with your truck!"
            </div>
        </div>
    </div>
    <div class="media">
        <a class="pull-left" href="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png">
            <img class="media-object" src="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png" alt="">
        </a>
        <div class="media-body">
            <a target="_blank" class="pull-left" href="https://twitter.com/Ford Motor Company">
                <strong>Ford Motor Company  @Ford</strong>
            </a>
            <br>
            <small class="text-muted">06-02-2015 08:37 PM</small>
            <small data-original-title="Favorite" data-toggle="tooltip" class="text-muted favorite"><i class="glyphicon glyphicon-star"></i>22</small>
            <div class="fb_desc">
                "We teamed up with @jonathanadler to create the ultimate road trip u2014 driving directions here: http://t.co/UzE37As167 http://t.co/exDDFJmnGL" </div>
            <div class="ista_usr_img">
                <a data-rel="prettyPhoto" href="http://pbs.twimg.com/media/CGhAyeXUcAEJjA5.jpg">
                    <img alt="" class="thumbnail img-responsive" src="http://pbs.twimg.com/media/CGhAyeXUcAEJjA5.jpg">
                </a>
            </div>
        </div>
    </div>
</div>

我的jquery代码，找到点击媒体：

$('.activity-list.media').click(function (e) {
        alert('media');
  });

但点击媒体div时没有收到任何警告信息。

问题更新：

在ajax调用之后，所有媒体div都设置在activity-list div上，因此给定的解决方案对我不起作用。

由于 Sameek

Answer 1

您的元素选择器错误请尝试： -

private class CallStateListener extends PhoneStateListener {
  @Override
  public void onCallStateChanged(int state, String incomingNumber) {
      switch (state) {
          case TelephonyManager.CALL_STATE_RINGING:
          // called when someone is ringing to this phone

          Toast.makeText(ctx, 
                  "Incoming: "+incomingNumber, 
                  Toast.LENGTH_LONG).show();
          break;
      }
  }
}

tm = (TelephonyManager) ctx.getSystemService(Context.TELEPHONY_SERVICE);
tm.listen(callStateListener, PhoneStateListener.LISTEN_CALL_STATE);

$('.activity-list .media').click(function (e) { alert('media'); });将选择元素同时具有类.activity-list.media和.ctivity-list，但是.media这将在具有类.activity-list .media的元素中选择具有类.media的元素

希望这会有所帮助。

Answer 2

请参阅下面的代码，这里是如何完成的

＆＃13;

$(document).ready(function() {
  $(".activity-list .media").click(function() {
    alert("media");

  })


})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="activity-list">
  <div class="media">
    <a class="pull-left" href="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png">
      <img class="media-object" src="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png" alt="">
    </a>
    <div class="media-body">
      <a target="_blank" class="pull-left" href="https://twitter.com/Ford Motor Company">
        <strong>Ford Motor Company  @Ford</strong>
      </a>
      <br>
      <small class="text-muted">06-02-2015 05:53 PM</small>
      <small data-original-title="Favorite" data-toggle="tooltip" class="text-muted favorite"><i class="glyphicon glyphicon-star"></i>0</small>
      <div class="fb_desc">
        "@Barsotta Happy 100,000 miles, Justin! Here's to your next milestone with your truck!"
      </div>
    </div>
  </div>
  <div class="media">
    <a class="pull-left" href="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png">
      <img class="media-object" src="http://pbs.twimg.com/profile_images/592781386324549633/5QdIRp9T_normal.png" alt="">
    </a>
    <div class="media-body">
      <a target="_blank" class="pull-left" href="https://twitter.com/Ford Motor Company">
        <strong>Ford Motor Company  @Ford</strong>
      </a>
      <br>
      <small class="text-muted">06-02-2015 08:37 PM</small>
      <small data-original-title="Favorite" data-toggle="tooltip" class="text-muted favorite"><i class="glyphicon glyphicon-star"></i>22</small>
      <div class="fb_desc">
        "We teamed up with @jonathanadler to create the ultimate road trip u2014 driving directions here: http://t.co/UzE37As167 http://t.co/exDDFJmnGL"</div>
      <div class="ista_usr_img">
        <a data-rel="prettyPhoto" href="http://pbs.twimg.com/media/CGhAyeXUcAEJjA5.jpg">
          <img alt="" class="thumbnail img-responsive" src="http://pbs.twimg.com/media/CGhAyeXUcAEJjA5.jpg">
        </a>
      </div>
    </div>
  </div>
</div>

＆＃13;

Answer 3

点击事件在定义事件的那一点不存在。我需要使用直播或委托活动。

$(document).on('click', '.media', function () {
        alert('media');
    });

OR

$('body').delegate('.media','click',function(){
     alert('media');
});

如何从多个重复元素中获取文本？

3 个答案: