Javascript 如何显示术语&；条件正确吗？

我在接受条款和条件的复选框旁边有一个标签。目前有一个简单的问题

用户可以在其中阅读条款

更舒适的做法是使用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>

这似乎不是正确的方法，因为当查看源代码时，术语中的文本将是可见的，我对此并不感到奇怪

---

那么什么是处理这个问题的“正确”方法呢？

为什么不使用jquery ui对话框呢。您只需设置容器并将其关联到dialog，然后只需使用jquery调用open或close方法。

我建议使用jquery UI dialog插件或类似FancyBox的东西。节省时间和头痛。这些插件使用AJAX加载内容，因此您不需要在第一个页面加载内容，如果您想使用更多这样的框，这可能是一个问题。

如果您不想立即在页面中使用源代码，您可以尝试使用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方式，但仍然有一个问题：

var termsUrl=''

它似乎没有生成php脚本，因此无法使用该脚本，但当手动添加URL时，它会工作，并以正确的方式获取文件。您可以尝试在HTML中定义变量。我已经用这个修改编辑了这个例子。好的，就是这样。现在它的工作应该是。非常感谢你的帮助！祝您有个美好的一天。

<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>

<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>

$(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; 
    });
});