Question

我正在尝试进行简单的聊天操作，其中我是第一个用户，而您是第二个用户。我试图将输入文本放入ul li。条件，如果上一个ul上课我，那么提醒我别的提醒你。请建议。

以下是我的代码。

HTML

<div class="chat-left">
    <div class="msg-area">
        <ul class="me">
            <li>what is this msg</li>
        </ul>
        <ul class="you">
            <li>others message</li>
        </ul>
    </div>
    <form id="me">
        <input type="text" name="mymsg" />
        <input type="submit" class="submit" name="submit" />
    </form>
</div>

的jQuery

$(document).ready(function () {
    $('#me').submit(function (event) {
        event.preventDefault();
        console.log('left');
        var $mymsg = $('input[type="text"]').val();
        $(this).siblings('.msg-area ul').each(function () {
            if ($(this).hasClass('me')) {
                console.log('me');
            }
        });
    });
});

Answer 1

使用此功能。

$(this).siblings('.msg-area').find('ul.me').each(function() {
    console.log('me');
});

Answer 2

选择器siblings('.msg-area ul')无法正常工作，因为ul不是兄弟元素，您需要使用siblings('.msg-area').find('ul')

你不需要循环来做那件事

＆＃13;

$(document).ready(function() {
  $('#me').submit(function(event) {
    event.preventDefault();

    var mymsg = $(this).find('input[type="text"]').val();

    var $last = $(this).siblings('.msg-area').find('ul:last');
    if ($last.hasClass('me')) {
      $('#log').html('me')
    } else {
      $('#log').html('you')
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="log"></div>
<div class="chat-left">
  <div class="msg-area">
    <ul class="me">
      <li>what is this msg</li>
    </ul>
    <ul class="me">
      <li>others message</li>
    </ul>
  </div>
  <form id="me">
    <input type="text" name="mymsg" />
    <input type="submit" class="submit" name="submit" />
  </form>
</div>

＆＃13;

如果子元素有类，则提醒

2 个答案: