2013-10-24 26 views
0

我在複選框旁邊有一個標籤,用於接受條款&條件。目前,有一個簡單的如何正確顯示條款和條件?

<a href="/termns.php">Terms</a>

,其中一個用戶可以閱讀條款。

更舒服的是使用jQuery在同一頁面上添加一個灰色框。

要提供更多信息,我正在使用多語言網站。事實上,可以在每個語言版本中創建一個包含所有文本的文件,但該文件會變得非常混亂。

這就是爲什麼我對該問題採取瞭解決方法並使用模板來獲取正確版本的原因。在會話設置的問題中,會有一個重定向到正確的目錄。所以主文本文件放置在/language/terms.php模板將被包含一次。

現在我玩了一圈,發現這樣的:

jQuery的:

$(document).ready(function(){ 
    $('#popup_terms').click(function(){ 

     $("#screen").css({ 
      "display": "block", 
      "width": $(document).width(), 
      "height": $(document).height(), 
      opacity: .7, 
     }); 

     $("#screen-box").css({ 
      "display": "block", 
     }); 
     return false; 
    }); 
}); 

的HTML:

<label for ="tandc"><?php echo $signup_tac;?></label> 
<div id="screen"></div> 
<div id="screen-box"> 
    <?php include_once "../$language/popup_$filename.php";?> 
</div> 

的CSS:

#screen{ 
    position: fixed; 
    z-index: 100; 
    display: none; 
    border: none; 
    background: black; 
    top: 0; 
    left: 0; 
} 

#screen-box{ 
    position: fixed; 
    z-index: 500; 
    display: none; 
    height: 400px; 
    padding: 50px; 
    width: 600px; 
    top: 50px; 
    left: 25%; 
    overflow: scroll; 
} 

這似乎不是正確的窪因爲當查看源代碼時,術語中的文本將是可見的,這是我不知道的。

那麼,什麼是「正確」的方式來處理這個問題?

+0

請看這個鏈接... http://www.aspdotnet-suresh。com/2013/03/simple-jquery-modal-popup-window-example.html –

回答

1

如果您不希望源代碼立即出現在頁面中,您可以嘗試使用ajax或iframe。

假設路徑../$language/popup_$filename.php可以被用戶的瀏覽器訪問,解決方案如下。

iframe的方式

<label for ="tandc"><?php echo $signup_tac;?></label> 
<div id="screen"></div> 
<div id="screen-box"> 
    <iframe src="<?php echo "../$language/popup_$filename.php"?>"></iframe> 
</div> 

的AJAX方法

HTML:

<label for ="tandc"><?php echo $signup_tac;?></label> 
<div id="screen"></div> 
<div id="screen-box"></div> 
<script>window.termsUrl = '<?php echo "../$language/popup_$filename.php"?>';</script> 

的Javascript:

$(document).ready(function(){ 
    $('#popup_terms').click(function(){ 
     $("#screen-box").load(window.termsUrl, function(){ 
      $("#screen").css({ 
       "display": "block", 
       "width": $(document).width(), 
       "height": $(document).height(), 
       opacity: .7, 
      }); 

      $("#screen-box").css({ 
       "display": "block", 
      }); 
     }); 
     return false; 
    }); 
}); 
+0

你好,謝謝你的回答。我嘗試了ajax的方式,仍然有一個問題,該行:'var termsUrl ='<?php echo「../$ language/popup_ $ filename.php」?>';'它似乎不會生成php腳本所以它不起作用,但當手動添加URL時,它會起作用,並且它會以正確的方式獲取文件。 – bonny

+0

您可以嘗試在HTML中定義變量。我已經編輯了這個變化的例子。 – hazerd

+0

好的,就是這樣。現在它的工作原理應該如此。非常感謝你的幫助!祝你今天愉快。 – bonny

0

爲什麼你不使用jQuery UI對話框。您只需要設置容器並將其關聯到對話框,然後您只需使用jquery調用打開或關閉方法即可。

0

我推薦使用JQuery UI對話插件或類似FancyBox的東西。節省時間和頭痛。這些插件通過AJAX加載內容,因此您不需要將內容包含在第一個頁面加載中,這可能是您想要使用更多盒子時的問題。