javascript - 重置节点顺序并隐藏 event.srcElement

Question

我正在构建一个自定义公司层次结构，并且需要能够“提升”一个 Div 在公司图表中的排名。我将触发器作为一个跨度放置在每个 div 内。单击事件设置为查找父 div 并将其与上一个 div 交换。我工作得很好，问题是:

1. 在此之后，我需要“重置”文档中节点的顺序，以便后续交换按照新顺序进行，而不是按照加载时存在的顺序进行。

2. 我需要查找交换的 div 在组中的位置，以及它是否是隐藏包含向上按钮的跨度的系列中的第一个。我会想象具有这种逻辑的东西:

   if(event.srcElement.parent().prev() = Null { 
       event.srcElement.parent().hide() 
   }; else { 
       return false;
   };
   

我知道语法错误，但我是 js 新手，所以请为我指出正确的方向。

这是我现在正在使用的代码。按照目前的情况，如果我将 3 个元素的顺序从 1,2,3 交换到 2,1,3，您会认为单击 3 上的交换会将其与现在之前的 1 交换，但它会与 2 交换，页面加载时位于其前面的元素。

<script type="text/javascript">

$(document).ready(function() {  

    $(".go-swap").click(function() {  
        $(this).parent().parent().prev().swap({  
            target: (this).parentNode.parentNode.id, 
            opacity: "0.5", 
            speed: 1000, 
            callback: function() { 
            event.srcElement.parent().hide()
            } 
        });  
    });  
});  
</script>

<div class="known" id="A101">
    Contact 1
    <span class="plus">
        <a href="javascript://" class="go-swap"><img src="images/uparrow.gif" border="0" /></a>
    </span>
 </div>
 <div class="known" id="A102">
    Contact 2
    <span class="plus">
        <a href="javascript://" class="go-swap"><img src="images/uparrow.gif" border="0" /></a>
    </span>
 </div>
 <div class="known" id="A103">
    Contact 3
    <span class="plus">
        <a href="javascript://" class="go-swap"><img src="images/uparrow.gif" border="0" /></a>
    </span>
 </div>

Answer 1

这是您的选择

1)服务器端代码+数据库:

如果您希望整个组织都能查看“新结构”，您将必须使用数据库和服务器端代码。您无法使用客户端 JavaScript 编辑实际文件。

2)本地存储:

如果只有您自己使用，您可以将数据保存在本地存储中，并在每次加载页面时访问该结构。