Question

我有一个可能会或可能不会滚动页面的onkeydown事件，可能会也可能不会设置变量。我想有一个onscroll事件，将该变量设置为false。我不希望onkeydown事件触发onscroll事件。我怎么能这样做？

编辑：添加了我的代码。它允许您使用左右箭头键在页面上的图像中上下移动。对不起，它太宽了。

<script>
    window.anImageHasBeenCentered = false;

    window.onkeydown = function ( key )
    {
        var element = document.elementFromPoint ( window.innerWidth / 2, window.innerHeight / 2 );

        if ( anImageHasBeenCentered ) // move to next image
        {
            switch ( window.event ? event.keyCode : key.keyCode )
            {
                case 37: element = element.parentNode.previousSibling.previousSibling.firstChild; break; // Left Arrow
                case 39: element = element.parentNode.nextSibling.nextSibling.firstChild; break; // Right Arrow
                default: anImageHasBeenCentered = false; element = null;
            }
        }

        else // center current image
        {
            switch ( window.event ? event.keyCode : key.keyCode )
            {
                case 37: break; // Left Arrow
                case 39: break; // Right Arrow
                default: element = null;
            }
        }


        if ( element )
        {
            element.scrollIntoView ( );

            if ( ( window.innerHeight + window.scrollY ) < document.body.offsetHeight ) // if we are not at the bottom of the page
            {
                if ( element.offsetHeight < window.innerHeight ) // if the element is shorter than the screen
                { window.scrollBy ( 0, -( ( window.innerHeight - element.offsetHeight ) / 2 ) ) } // position it in the middle of the screen
            }

            anImageHasBeenCentered = true;
        }
    };

    // The function I would like to add, that is unfortunately triggered by the onkeydown function.
    // window.onscroll = function ( ) { anImageHasBeenCentered = false; }
</script>

Answer 1

我找到了解决方法。我不知道我是否能真正保证它始终有效，但它到目前为止。我只是使用setTimeout将我的变量设置为true，直到onscroll将其设置为false。

window.anImageHasBeenCentered = false;

window.onscroll = function ( ) { anImageHasBeenCentered = false; };

window.onkeydown = function ( key )
{
   var element = document.elementFromPoint ( window.innerWidth / 2, window.innerHeight / 2 );

   switch ( window.event ? event.keyCode : key.keyCode )
   {
      case 37: // Left Arrow
         if ( anImageHasBeenCentered ) element = element.parentNode.previousSibling.previousSibling.firstChild;
         break;
      case 39: // Right Arrow
         if ( anImageHasBeenCentered ) element = element.parentNode.nextSibling.nextSibling.firstChild;
         break;
      default: element = null;
   }


   if ( element )
   {
      element.scrollIntoView ( );

      if ( ( window.innerHeight + window.scrollY ) < document.body.offsetHeight ) // if we are not at the bottom of the page
      {
         if ( element.offsetHeight < window.innerHeight ) // if the element is shorter than the screen
            window.scrollBy ( 0, -( ( window.innerHeight - element.offsetHeight ) / 2 ) ); // position it in the middle of the screen
      }

      window.setTimeout ( function ( ) { anImageHasBeenCentered = true; }, 1 );
   }
};

如何阻止javascript事件触发另一个（不同的）事件？

1 个答案: