Question

我使用的是SharePoint 2013，我的页面上有一个列表Web部件，该部件包含两列（标题，说明）。我希望Description的和都在页面加载时隐藏。然后，当用户将鼠标悬停在“标题”字段上时，说明将显示在弹出窗口中。

我一直在和jQuery父母，父母，兄弟姐妹，孩子，查找和next方法一起玩。

我认为下面的方法会起作用，但是当我将鼠标悬停在“标题”字段上时，仅显示/隐藏“说明2”。

因为我是新手，所以现在就从这里开始。

$(document).ready(function(){
  $('a.mslistlink').hover(
  function(){
    $(".ms-list-itemLink").next().show();
  }
    ,
  function(){
    $(".ms-list-itemLink").next(".ms-vb-lastCell").hide();
  }  
  );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
      <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
</head>
<body>
  <table>
    <thead>
      <tr class="ms-viewheadertr"></tr>
      <th>Title</th>
      <th>...</th>
      <th>Description</th>
    </thead>
    <tbody class="listviewtable">
      <tr class="ms-itmHoverEnabled">
        <td class=ms-cellstyle>
          <div class="ms-vb">
             <a class="mslistlink">Title 1</a>
          </div>
        </td>
        <td class="ms-list-itemLink">...</td<
        <td class="ms-vb-lastCell">Description1</td>
      </tr>
      <tr class="ms-alternating">
        <td class="ms-cellStyleNonEditable"></td>
        <td class="ms-cellstyle">
          <div class="ms-vb">
            <a class="mslistlink">Title 2</a>
          </div>
        </td> 
        <td class="ms-list-itemLink">...</td>
        <td class="ms-vb-lastCell">Description2</td>
     </tbody>
  </table>
</body>
</html>

TIA

将鼠标悬停在另一个字段上时如何显示弹出框？

0 个答案: