Question

我有一张表输出大约1k的记录。

因为我需要点击许多记录来查看所有记录，但是当我向下滚动并点击名称时，它会同时显示输出放在上面。

如何在不向上滚动的情况下显示我在浏览器上单击的位置旁边显示文本？

我做了http://jsfiddle.net/xhow5n44/。我不确定这是否会更容易通过css或javascript实现。

<script language="JavaScript">
 $(document).ready(function() {
     $('a').click(function () {
         var StateName = $(this).attr("detail");
         $('#maintext').show();
         $('#output').html(StateName);
     });
 });
</script>

<table class="tablecolors">
      <thead><th scope="col">Name</th><th scope="col">Ext:</th><th scope="col">Title </th></thead>
        <tbody>
        <cfloop query="Corporate"  >
        <cfoutput>
        <tr>
        <td ><a  id="showdata"  detail="Cell:<cfif  #Corporate.emp_cell# eq ""> No Number<cfelse>#Corporate.emp_cell# </cfif> 
        <br/>test">
        #Corporate.emp_namefirst#       
        <td ><div align="center">#Corporate.emp_ext#</div></td>
        <td > <cfif #Corporate.title_id# is not 19>#Corporate.title_name#</cfif> </td>

        </tr>
        </cfoutput>
        </cfloop>

        </tbody>
</table>

    <h2 id="maintext" style="display: none;">Here We will Display </h2>
    <div id="output"></div>

Answer 1

请参阅此following Stack Overflow Answer以获取鼠标位置。获得后，您可以使用它通过CSS和jQuery基于该值定位文本。

$(elem)
  .css('left', value_x + 'px')
  .css('top', value_y + 'px');

修改正如Roko在评论中所注意到的，上面的代码可以通过使用像

这样的对象表示法来改进
$(elem).css({ 'top': value_y, 'left': value_x });

如何在单击的位置旁边输出文本？

1 个答案: