Question

我有一个使用ui-grid-cellNav的uiGrid，它提供单击编辑字段。如果屏幕顶部有空间使得网格不在顶部，则单击将使页面跳转到顶部。此外，网格上方的任何按钮都会在发生这种情况后停止响应第一次单击的点击。要查看行为，请打开PLNKR，然后只需单击标记为＆＃39; 1＆＃39;的第一个单元格。屏幕将跳转滚动，使网格位于屏幕顶部。现在滚动屏幕，以便您可以看到“取消”按钮并单击它。屏幕将跳回网格。再次向上滚动并单击取消，现在该按钮将起作用。

这是一个plnkr https://plnkr.co/edit/OVNUeaGqTAoJqdZvqmQ8?p=preview

我推断出rowHese中大于默认值的rowHeight是原因。

rowHeight: 87

如果您注释掉rowHeight选项，则不会发生这种情况。我一直在调试uiGridCellNav代码，这似乎是由focus.byElement函数中的某些东西引起的，但就我所知。

Answer 1

阻止页面滚动的任何网格高度都将解决此问题

var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
  acc[i].onclick = function() {
    this.classList.toggle("active");
    var panel = this.nextElementSibling;
    if (panel.style.maxHeight) {
      panel.style.maxHeight = null;
    } else {
      panel.style.maxHeight = panel.scrollHeight + "px";
    }
  }
}

var myJSON = '{ "title":"The Title of the artice","Aetype":"type","Aelink":"link","link":"Link to the artice","content":"The content of the article","enclosures":"The enclosures of the artice","authors":"The authors of the artice","publishedAt":"Article Publish Date","Stream":"Streaming the Article"}';
var myObj = JSON.parse(myJSON);
document.getElementById("Gparticle").innerHTML = myObj.title;
document.getElementById("Gparticle1").innerHTML = myObj.link;
document.getElementById("Gparticle2").innerHTML = myObj.content;
document.getElementById("Gparticle3").innerHTML = myObj.enclosures;
document.getElementById("Gparticle4").innerHTML = myObj.authors;
document.getElementById("Gparticle5").innerHTML = myObj.publishedAt;
document.getElementById("Gparticle6").innerHTML = myObj.Stream;
document.getElementById("Gparticle8").innerHTML = myObj.Aetype;
document.getElementById("Gparticle7").innerHTML = myObj.Aelink;

我已经用一些随机高度编辑了你的plunker，因此问题解决了https://plnkr.co/edit/VWR0qeVvmbmnQUaNpudD?p=preview

带有uiGridCellNav屏幕的uiGrid跳转点击和焦点

1 个答案: