如何以正确的方式显示术语和条件

How to display terms & conditons the right way?

本文关键字：显示 术语 条件 方式      更新时间：2023-09-26

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

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

这似乎不是正确的方法，因为在查看源代码时，术语中的文本将可见，我并不想知道。

那么，处理这个问题的"正确"方法是什么？

如果您不希望页面中的源代码立即出现，您可以尝试 ajax 或 iframe。

假设路径../$language/popup_$文件名.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>

阿贾克斯之道

.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; 
    });
});
为什么

不使用jQuery UI对话框。 你只需要设置容器并关联到对话框，那么你只需要使用 jQuery 调用 open 或 Close 方法即可。

我建议使用JQuery UI对话框插件或类似FancyBox的东西。节省时间和头痛。这些插件使用 AJAX 加载内容，因此您无需在第一个页面加载中包含内容，当您想使用更多这样的框时，这可能是一个问题。

相关文章：