在弹出窗口关闭后在原始页面显示jQuery ajax变量 - display jQuery ajax variable in original page after popup window close

我试图在关闭jQuery窗口后显示数据。我知道数据在那里-我可以在关闭jQuery窗口后在警告窗口中显示它。但是…，我希望在jQuery窗口关闭后，在父窗口(因为没有更好的术语)中显示相同的数据。我花了三周时间想解决这个问题。请帮助!最近我一直在想我需要刷新或重新加载父页面?如果"父页面"是不正确的术语，我道歉。我的意思是;调用jQuery弹出窗口的原始页面

 <!doctype html>
      <html lang="en">
      <head>
      <meta charset="utf-8">
      <title>jQuery UI Dialog - Default functionality</title>
      <link rel="stylesheet" href="//whosgotbooks.com/jquery/jquery-ui-1.10.4.custom.css">
      <script src="//whosgotbooks.com/jquery/jquery-1.10.2.js"></script>
      <script src="//whosgotbooks.com/jquery/jquery-ui-1.10.4.custom.js"></script>
      </head>
      <body>
      <div id="dialog" title="Google Books Search Results" style="display:none;">
      <script>
      var book_title;
      $(function() { 
      $( "#dialog" ).dialog({
        height: 550, width: 450});
        $( ".btn" ).click(function(){ 
       //var book_title = $item['volumeInfo']['title'];
       $.ajax({
         type: "POST",
         url: 'book-meta.php',
         //dataType: 'json',
         //data: { book_title : 'Success!' },
         data: { book_title : $("#returnvalues").val()  },
             success: function(data)
             {
             $.post("/wp-content/plugins/book-search-google/book-search-google.php", data);
             //$(".btn").load("/wp-content/plugins/book-search-google/book-meta.php", data);
             alert(data);
             //console.log(data);
             //$("#dialog").html(data);
             },
             error: function(errorThrown){
             alert('error');
             }
             });
      $( "#dialog" ).dialog( "close" );  
      });
      });
      </script>  
            <strong><p style="font-size: 16px; text-align: center";>Top 10 Results for &quot;<?php echo @$_POST['q']; ?>&quot;</p></strong> 
        <strong><p style="font-size: 14px; text-align: center";>choose a book to select as your topic</p></strong>&nbsp;
        <table style="width:400px">
        <col width="325">
        <col width="75">
            <?php foreach ($data['items'] as $item) { ?>
        <?php for($i =1; $i <11; $i++) { ?>     
                  <tr>
            <td>
                       <strong><u><div style="font-size: 14px";><?php printf($item['volumeInfo']['title'])?></u></div></strong>
                         <strong>Author: </strong><?php printf( $item['volumeInfo']['authors'][0])?><br />
                         <strong>Published: </strong><?php printf( $item['volumeInfo']['publishedDate']); ?><br />                       
               <strong>Page(s): </strong><?php printf( $item['volumeInfo']['pageCount']); ?><br />
                         <strong>Publisher: </strong><?php printf( $item['volumeInfo']['publisher']); ?><br />
                         <strong>Category: </strong><?php printf( strtolower($item['volumeInfo']['printType']).', '.strtolower($item['volumeInfo']['categories'][0])); ?>&nbsp;&nbsp;
               <strong>ISBN: </strong><?php printf( $item['volumeInfo']['industryIdentifiers'][0]['identifier']); ?></td>
            <td><p><input type="submit" method="post" name="selectbook" value="Select" class="btn" id="returnvalues"/></p>
            <img src="<?php printf( rawurldecode($item['volumeInfo']['imageLinks']['smallThumbnail'])); ?>" />
                    </td>
            <tr><td style="width:420px"><p><strong>Description: </strong><?php printf( $item['volumeInfo']['description']); ?><br /></p></td>           
            </tr>
            </tr>
            <?php } } }
            else {
                ?>
                   <p><strong>Sorry, there were no results</strong></p>
                <?php  } 
            /* for testing purposes show actual request to API - REMOVE when finished
            $apiRequest = $url;
            echo '<p>API request: '.$apiRequest.'</p>'; */ ?>
        </table>
      </div>
      </body>
      </html>
          <?php
          else: //show form and allow the user to check for Google Book search results
          ?>
      <p><form id="searchForm" name="searchForm" method="post"> 
        <fieldset id="searchBox">
            <label>Search for a Book:</label>
            <input class="text" id="q" name="q" type="text" value="Powered by Google" onfocus="this.value=''; this.onfocus=null;" />
            <select id="type" name="type" size="1">
                <option selected value="all">Book Title</option>
                <option value="isbn">Books by ISBN</option>
                <option value="lccn">Books by LCCN #</option>
                <option value="oclc">Books by OCLC #</option>                
            </select>
            <input class="submit" id="searchForm" name="submit" type="submit" value="Search"  />
        </fieldset>
      </form></p>
      <?php
      //end submit isset if statement on line 73
      endif;
}

这是我的book-meta.php代码(其中大部分被注释掉了-因为尝试了不同的东西):

     if ( isset( $_POST['book_title'] )) {
//       session_start();
//      header('Location: '.$_SERVER['REQUEST_URI']);
//      header('Location: '.$_SERVER['PHP_SELF']);
//        $book_title = $_POST['book_title'];
//        $_SESSION['book_title'] = $book_title;
//        echo $_SESSION['book_title'];
        $book_title = $_REQUEST['book_title'];
//      $book_title = (isset($_POST['book_title']))?$_POST['book_title'] : 'not yet';
        echo $book_title;
        echo "Test within IF statement <br>";
      }
      //$_SESSION['$book_title'] = (isset($_POST['book_title']) ? $_POST['book_title'] : "");
      echo "Test outside IF statement <br>";

下面是我如何调用book-meta.php:

  include 'book-meta.php';
  //$_SESSION['$book_title'] = (isset($_POST['book_title']) ? $_POST['book_title'] : "");
  echo $book_title;//

如果需要，我可以添加额外的源代码。请帮助!

如果你想在你的html页面中显示你的数据，我建议你在这个页面中放置一个div元素，你想要的id(让我们说"displayTest")。然后，在ajax回调函数中获取数据时，使用以下代码:

$( "#displayTest" ).append(data);

代替:

alert(data);

希望能有所帮助。