Question

HTML：

<div id="admin_chatRoom">
   <div class="msg_box admin-msg-box  1444229594038" style="right: 0px; margin-right: 7px;">
      <div class="msg_head activated" offset="0" c_id="1444229594038"><a id="2" class="closeChat" title="End Chat"><span class="fa fa-ban"></span></a>&nbsp;&nbsp;</div>
      <div style="display: none;" class="msg_wrap display-hide">
         <div class="msg_body">
            <div class="msg_a temp_msg">hio</div>
            <div class="msg_push"></div>
         </div>
         <div class="msg_footer"> <textarea class="msg_input" rows="4"></textarea></div>
      </div>
   </div>
   <div class="msg_box admin-msg-box  1444288416317" style="right: 250px; margin-right: 10px;">
      <div class="msg_head activated" offset="0" c_id="1444288416317"><a id="3" class="closeChat" title="End Chat"><span class="fa fa-ban"></span></a>&nbsp;&nbsp;</div>
      <div style="display: block;" class="msg_wrap display-hide">
         <div class="msg_body">
            <div class="msg_a temp_msg">hio</div>
            <div class="msg_push"></div>
         </div>
         <div class="msg_footer"> <textarea class="msg_input" rows="4"></textarea></div>
      </div>
   </div>
</div>

我想从<div class="msg_head activated" offset="0" c_id="1444229594038">得到最接近当前textarea的c_id属性的值。

JQuery的：

 $(document).ready(function () {

    $(document).on("keypress", ".admin-msg-box textarea", function (e) {
        if (e.keyCode == 13) {
            var msg = $(this).val();
            alert($(this).closest('c_id').val());
        }
    });
});

但它显示未定义。有什么想法吗？

Answer 1

首先，c_id属性无效 - 您应该使用data-*属性，以便您的网页不包含无效的HTML标记。其次，.msg_head.activated元素不是textarea的直接父级，因此closest()在这里不适合您。最后，c_id选择器将查找该类型的元素，而不是具有该属性的元素。

要执行您的操作，您可以使用closest()中的textarea来获取最近的.msg_box。从那里你可以找到具有你需要的属性的.msg_head，最后你可以使用data()来读取它的值。尽管如此，试试这个：

<div id="admin_chatRoom">
    <div class="msg_box admin-msg-box  1444229594038" style="right: 0px; margin-right: 7px;">
        <div class="msg_head activated" data-offset="0" data-c_id="1444229594038">
            <a id="2" class="closeChat" title="End Chat">
                <span class="fa fa-ban"></span>
            </a>
            &nbsp;&nbsp;
        </div>
        <div style="display: none;" class="msg_wrap display-hide">
            <div class="msg_body">
                <div class="msg_a temp_msg">hio</div>
                <div class="msg_push"></div>
            </div>
            <div class="msg_footer">
                <textarea class="msg_input" rows="4"></textarea>
            </div>
        </div>
    </div>
    <div class="msg_box admin-msg-box 1444288416317" style="right: 250px; margin-right: 10px;">
        <div class="msg_head activated" data-offset="0" data-c_id="1444288416317">
            <a id="3" class="closeChat" title="End Chat">
                <span class="fa fa-ban"></span>
            </a>
            &nbsp;&nbsp;
        </div>
        <div style="display: block;" class="msg_wrap display-hide">
            <div class="msg_body">
                <div class="msg_a temp_msg">hio</div>
                <div class="msg_push"></div>
            </div>
            <div class="msg_footer">
                <textarea class="msg_input" rows="4"></textarea>
            </div>
        </div>
    </div>
</div>

$(document).on("keypress", ".admin-msg-box textarea", function (e) {
    if (e.keyCode == 13) {
        var msg = $(this).val();
        alert($(this).closest('.msg_box').find('.msg_head').data('c_id'));
    }
});

Example fiddle

Answer 2

$(document).on("keypress", ".admin-msg-box textarea", function (e) {
    if (e.keyCode == 13) {
        var msg = $(this).val();
        var c_id = (($(this).parents('div.msg_box.admin-msg-box')).find('.msg_head.activated')).attr('c_id');
        alert(c_id);
    }
});

Answer 3

最近，只选择直接父母。你想要选择的div是父母的兄弟姐妹。也可以使用.attr（）方法读取属性值而不是.val（）

试试这个：

alert($(this).closest('.admin-msg-box').find('div[c_id]').attr('c_id'));

Fiddle here

使用jQuery获取最接近的属性值

3 个答案: