2013-07-03 63 views
0

嗨我正在使用下面的代碼將文件modal_window.php加載到當前頁面上的模態窗口中。將php變量傳遞給模態窗口的麻煩

<style> 
     * { 
      margin:0; 
      padding:0; 
     } 

     #overlay { 
      position:fixed; 
      top:0; 
      left:0; 
      width:100%; 
      height:100%; 
      background:#000; 
      opacity:0.5; 
      filter:alpha(opacity=50); 
     } 

     #modal { 
      position:absolute; 
      background:url(tint20.png) 0 0 repeat; 
      background:rgba(0,0,0,0.2); 
      border-radius:14px; 
      padding:8px; 


     } 

     #content { 
      border-radius:8px; 
      background:#fff; 
          padding:20px; 

     } 

     #close { 
      position:absolute; 
      background:url(close.png) 0 0 no-repeat; 
      width:24px; 
      height:27px; 
      display:block; 
      text-indent:-9999px; 
      top:-7px; 
      right:-7px; 
     } 
    </style> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> 
      </script> 
    <script> 



     var modal = (function(){ 
      var 
      method = {}, 
      $overlay, 
      $modal, 
      $content, 
      $close; 

      // Center the modal in the viewport 
      method.center = function() { 
       var top, left; 

       top = Math.max($(window).height() - $modal.outerHeight(), 0) 
            /2; 
       left = Math.max($(window).width() - $modal.outerWidth(), 0) 
           /2; 

       $modal.css({ 
        top:top + $(window).scrollTop(), 
        left:left + $(window).scrollLeft() 
       }); 
      }; 

      // Open the modal 
      method.open = function (settings) { 
       $content.append(settings.content); 

       $modal.css({ 
        width: settings.width || 'auto', 
        height: settings.height || 'auto' 
       }) 

       method.center(); 

       $(window).bind('resize.modal', method.center); 

       $modal.show(); 
       $overlay.show(); 
      }; 

      // Close the modal 
      method.close = function() { 
       $modal.hide(); 
       $overlay.hide(); 
       $content.empty(); 
       $(window).unbind('resize.modal'); 
      }; 

      // Generate the HTML and add it to the document 
      $overlay = $('<div id="overlay"></div>'); 
      $modal = $('<div id="modal"></div>'); 
      $content = $('<div id="content"></div>'); 
      $close = $('<a id="close" href="#">close</a>'); 

      $modal.hide(); 
      $overlay.hide(); 
      $modal.append($content, $close); 

      $(document).ready(function(){ 

       $('body').append($overlay, 
          $modal);       
      }); 

      $close.click(function(e){ 
       e.preventDefault(); 
       method.close(); 
      }); 

      return method; 
     }()); 

     // Wait until the DOM has loaded before querying the document 
     $(document).ready(function(){ 

         varid = '<?php if(isset($_GET['id'])); ?>'; 


      $('a#testmodal').click(function(e){ 
       $.get('modal_window.php?id=varid', function(data){ 
             modal.open({content: data});}); 
       e.preventDefault(); 
      }); 





     }); 



    </script> 
</head> 
<body> 


<a id="testmodal" href="modal.php?id=1">Test</a> 

這樣做雖然我試圖傳遞變量$ ID用來modal_window.php:

varid = '<?php if(isset($_GET['id'])); ?>'; 

然後

$('a#testmodal').click(function(e){ 
       $.get('modal_window.php?id=varid', function(data){ 
             modal.open({content: data});}); 
       e.preventDefault(); 
      }); 

相反的$ id的實際值(在這種情況下是1)傳遞給modal_window.php傳遞的是java腳本變量(varid)的名稱。所以「varid」是modal_window.php顯示的內容。有沒有人看到我犯的錯誤?謝謝!

+0

請不要發佈您的所有代碼,請把它修剪到只有重要的部分。 – Ohgodwhy

+0

沒關係我解決了它 –

回答

1

在您的獲取調用中,您的id等於文字varid。相反,也許

$.get('modal_window.php?id=' + varid, function(data){ 
            modal.open({content: data});}); 
      e.preventDefault(); 
     }); 
+0

哦好吧謝謝我也會嘗試! –

+0

如果有效,請標記爲正確答案 – Shane