如何将内容添加到单击其父 li 的特定 UL

how to add content to the specific ul of whose parent li is clicked?

本文关键字:li UL 单击 添加      更新时间:2023-09-26

我想添加一些内容,并删除任何以前点击的 li 的内部 html?

 <html>
    <head>
    <link rel="stylesheet" type="text/css" href="testtab.css"/>
    <script type="text/javascript" src="scripts/jquery-1.10.1.min.js"></script>
    <script>
     $('#chat ul li a').on('click', function (e) {
     alert("in");
     alert($(this).closest('li').index());
     });
    </script>
    </head>
    <body>
    <div id="chat" class="chat">
    <ul class="chatmenu">
        <li id="one" class="users"><a href="#one">abcy<span class="notify">1 new*</span></a>
            <div class="chattng">
                <ul class="overl">
                </ul>
            </div>
        </li>
        <li id="two" class="users"><a href="#two">avvv<span class="notify">a</span></a>
            <div class="chattng">
                <ul class="overl">
                </ul>
            </div>
        </li>
        <li id="three" class="users"><a href="#three">gtt<span class="notify">d</span></a>
        </li>
        <li id="four" class="users"><a href="#four">trt<span class="notify">e</span></a></li>
        <li id="five" class="users"><a href="#five">kkk<span class="notify">f</span></a></li>
    </ul>
    </div>
    </body>
 </html>

一旦知道了,那么如何做到这一点,无论单击哪个 li,它的 innerhtml 都会得到一些东西,而被点击的上一个 li 将 InnerHtml 作为 null?

您在不支持它的版本上使用live。使用on .

 $('#chat ul li a').on('click', function (e) {
     alert($(this).closest('li').index());
 });

您必须包装这是处理程序ready以便在#chat中的元素准备就绪并初始化时触发。

$(document).ready( function () {
   $('#chat ul li a').on('click', function (e) {
         alert($(this).closest('li').index());
   });
});

这是一个演示:http://jsfiddle.net/hungerpain/Rr2dP/

或者,您可以将此事件绑定到document对象:

$(document).on('click', '#chat ul li a' ,function (e) {
    alert($(this).closest('li').index());
});

这就是live过去的做法。

有人可以去编辑这个问题吗?找到点击的李数这是此信息的来源。我们现在不希望 ppl 遵循过时的信息,是吗?

将函数包装在 $(document).ready();

<script>
$(document).ready(function(){
 $('#chat ul li a').on('click', function (e) {
 alert("in");
 alert($(this).closest('li').index());
 });
});
</script>