Question

我有一个包含div和链接的项目列表，例如

<ul>
    <li class="item">
       <div class="div1"></div>
       <a class="link1"></a>
   </li>
   <li class="item">
      <div class="div1"></div>
      <a class="link1"></a>
  </li>
  <li class="item">
     <div class="div1"></div>
    <a class="link1"></a>
  </li>
</ul>

我想单击列表项（link1）中的链接并更新/操作当前列表项的div内容（div1）。单击其他列表项中的链接应该对其对应的div执行相同的操作。

有关如何完成此任务的任何帮助。

Answer 1

$(function(){
  $("li.item a.link1").click(function() {
    $(this).siblings("div.div1").html("Yeah, that's the manipulated div.");
  });
});

参考：

http://api.jquery.com/siblings/

Answer 2

试试这个：

$(function(){
    $("a.link1").click(function(){
        var div1 =  $(this).prev("div.div1")
        //Do something with div1
    });
});

Answer 3

$("a[class^='link']").click(function () {
    var div = $(this).siblings("div");
    // Update div
});

示例： http://jsfiddle.net/tqDsD/

单击当前列表项中的链接时如何操作div

3 个答案: