以前在网上看这样的JS效果：。

编辑时点击：(抱歉，图片在文章后面)。列表和编辑器在同一个页面上的效果真的很好，可以给用户带来意想不到的精彩体验。但是它是怎么发生的呢？其实有很多方法可以达到这种效果。当然，如果你的JS不好，可以用JQuery的组件，但是我觉得自己能写出来总是好的。所以我花了一些时间才意识到。当我意识到的时候，发现实现这个效果非常简单，做了几行JS代码。关键是思考的问题。下面我会详细写如何实现。General IDea:给TR一个id来显示和隐藏以达到这个效果。首先要意识到这个关键的桥梁是“ID”，因为你想显示和隐藏一个tr，唯一能区分它们的就是它们的ID号。当然我们还是用循环输出的形式“TR Style=' Color3360 # 0033 FFdisplay:none'id='？PHP echo $ value[' uuid ']；'"。然后我们可以通过他们在JS代码中的ID号来识别他们。但关键问题又来了。我们如何得到这个ID值？可能有些朋友跟我一样想到了隐藏域，我一开始也想到了，但是那也没有什么好处，因为当你用JS在隐藏域中获取值的时候，它的ID是死的，所以每次只能获取第一个tr的ID号，其他的就不行了。那怎么办？哈哈。别担心。人总是有办法的。我们还有“这个”。这个关键词真的是个好东西。有了它，“我们不怕天空”.所以，我们写“a href=' #' onclick=' display(这个。id)' id='？PHP echo $ value[' uuid ']；/m ' .这样我们就很容易得到了类似tr的ID号(注：为什么说和我后面要说的差不多)？可能细心的朋友看到了我的代码，有一个“/m”。写这个的原因是应该和trID分开，否则不会得到值(ID是唯一的)。这样，如果tr的ID号是“1223”，那么我的“onclick”事件的值就是“1223/m”，我们是用JS的字符串分段法得到与TR相同的ID号。" var va array=va . split('/')；var id=va array[0]；" .好吧。既然我们有了所有的身份证号码，我们不能做什么？嘿嘿。让我们在下面展示一下。”document . getelementbyid(id). style . display=' block '；“好的.超过.下面是一些关键代码：JS如下：复制代码如下：//显示函数display(va){ var va array=va . split('/')；var id=va array[0]；document . getelementbyid(id). style . display=' block '；var parID=id ' pdocument . getelementbyid(ParId). style . display=' none '；//这里是一个tr}的隐藏部分html部分如下：复制代码如下： tr bgcolor=' # d3d ce 3 ' style=' color 3360 # 0033 ff；display:none'id='？PHP echo $ value[' uuid ']；'th=' 13% ' modify input type=' button ' name=' input ' value=' save '/input type=' button ' name=' input ' value=' cancel ' onclick=' backs(this . id)' id='？PHP echo $ value[' uuid ']；/n/th/th宽度='11% '输入名称='text '类型='text '值='？PHP echo $ value[' username ']；'//第th宽度='15% '输入名称='text '类型='text '值='？PHP echo $ value[' create time ']；'//第th宽度='8% '输入类型='text '名称='Input '值='？PHP echo $ value[' uuid ']；'//th a href=' # ' onclick=' display(this . id)' id='？PHP echo $ value[' uuid ']；/m' show！-这里是触发器JS - /a /th /tr。另一种解释：1我发布的时候上面的代码可能是错的。如果无法实现，请联系我。以上只是我的学习记录，可能不专业。如果有错误，欢迎指出，我一定会改进。