点击图片后如何导航到另一页

Question

我开发了一款完美的记忆游戏。在游戏页面中，找到匹配项后，图像将显示在页面右侧。 我想要的是单击该图像时导航到另一个页面。

另一个页面是标签管理页面，因此我需要访问图像和xml文件。

在游戏中找到匹配项时，我用来显示图像的代码：

function getpicture(){
  document.getElementById('picture').innerHTML = getgImage(event.target.dataset.number);

  pic = document.getElementById('picture').innerHTML;
  $.ajax({
    type: 'POST',
    url: 'maingame.php',
    data: {
      'pic': pic,
    },
  })
}

在html端：

<div class="imageside" id="picture"> <?php

  if (isset($_POST['pic'])) {
    $picture = $_POST['pic'];
    $link_array = explode('/', $picture);
    $imgpath = end($link_array);
    $ext = substr($imgpath, strrpos($imgpath, "."));
    $imgname = str_replace($ext, '', $imgpath);

    $dire = "Annotated Dataset/data/";

    $file = $dire.$imgname.'.xml';

    $xml = @simplexml_load_file(@$file);

    if(!empty($xml->globalvalidation->true)){
      $validclass = 'blurclass';
    }else{
      $validclass = 'img_src';
    }?>

  <img src="<?php echo "$picture"; ?>" class="<?php echo $validclass; ?>">

<?php } ?></div>

<script>
  $('.img_src').click(function(){
    var images = $(this).attr('src');
    var url = 'validation.php';
    var form = $('<form action="' + url + '" method="post">' +
      '<input type="text" name="img_url" value="' + images + '" />' +
      '</form>');
    $('body').append(form);
    form.submit();
  });
</script>

我尝试了上面的代码，但是当我单击图像时，它无法导航到其他页面。我想我介于两者之间。有人可以帮我解决问题，并帮助我解决该问题，然后单击图像导航到下一页。