-3

我正在detail一起使用新的 HTML5 元素和摘要。这是一个常见问题解答部分,所以有几个问题。它工作正常,但我需要一个额外的功能......如果用户打开第二个细节元素,第一个细节元素保持打开状态,这可能会令人不安。一旦打开另一个细节,我想关闭这个细节。

我也怀疑这是否对用户友好?

在这里,您有一张图片说明了我的意思并希望避免。

在此处输入图像描述

这里有一些代码,我的意思是:

http://jsfiddle.net/782HX/

4

2 回答 2

1

您可以使用 jQuery 轻松实现这一点。

$('details').click(function(event) {
    $('details').not(this).removeAttr("open");  
});

这将关闭所有其他详细信息,但单击的那一项除外。

于 2016-05-23T05:59:46.237 回答
0

对于任何有兴趣的人,我找到了答案……我在这里找到了:

如果您添加onclick="closeAll(thisindex(this));"到每个详细信息并添加此 javascript,它将在打开另一个详细信息时关闭打开的详细信息。希望能帮助到你!

function thisindex(elm){
  var nodes = elm.parentNode.childNodes, node;
  var i = 0, count = i;
  while( (node=nodes.item(i++)) && node!=elm )
    if( node.nodeType==1 ) count++;
  return count;
}

function closeAll(index){
  var len = document.getElementsByTagName("details").length;

  for(var i=0; i<len; i++){
    if(i != index){
      document.getElementsByTagName("details")[i].removeAttribute("open");
    }
  }
于 2013-10-31T16:21:51.457 回答