给Jeo博客主题的友链界面新增一个同意勾选！-故渊渡

效果图

代码：

找到主题文件夹下friends.php
从开始位置选中到 <?php $this->need(‘public/article.php’); ?>
然后复制下面的代码覆盖

{hide}

{mtitle title=” HTML “/}


<div id="Joe">
    <?php $this->need('public/header.php'); ?>
    <div class="joe_container">
      <div class="joe_main">
        <div class="joe_detail" data-cid="<?php echo $this->cid ?>">
          <?php $this->need('public/batten.php'); ?>
          <div class="form-container">
  <form id="conditionsForm">
       <h2 class="center-text">请勾选你符合的条件：</h2>
    <label>
      <input type="checkbox" name="condition[]" value="added_friend_link">
      <span>我已添加 故渊渡 博客的友情链接</span>
    </label>
    <label>
      <input type="checkbox" name="condition[]" value="personal_blog"> 
      <span>我的链接主体为 个人，网站类型为博客</span>
    </label>
    <label>
      <input type="checkbox" name="condition[]" value="accessible_in_cn"> 
      <span>我的网站现在可以在中国大陆区域正常访问</span>
    </label>
    
    <label>
      <input type="checkbox" name="condition[]" value="accessible_fl"> 
      <span>我接受并同意本站相关规则及政策</span>
    </label>
    <label>
      <input type="checkbox" name="condition[]" value="compliant_laws">
      <span>网站内容符合中国大陆法律法规</span>
    </label>
    <p id="instructions" class="hidden">勾选后展示评论区发送申请</p>
  </form>
</div>
          <?php $this->need('public/article.php'); ?>
<div id="Joe">
    <?php $this->need('public/header.php'); ?>
    <div class="joe_container">
      <div class="joe_main">
        <div class="joe_detail" data-cid="<?php echo $this->cid ?>">
          <?php $this->need('public/batten.php'); ?>
          <div class="form-container">
  <form id="conditionsForm">
       <h2 class="center-text">请勾选你符合的条件：</h2>
    <label>
      <input type="checkbox" name="condition[]" value="added_friend_link">
      <span>我已添加 故渊渡 博客的友情链接</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="personal_blog"> 
      <span>我的链接主体为 个人，网站类型为博客</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="accessible_in_cn"> 
      <span>我的网站现在可以在中国大陆区域正常访问</span>
    </label>
    
    <label>
      <input type="checkbox" name="condition[]" value="accessible_fl"> 
      <span>我接受并同意本站相关规则及政策</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="compliant_laws">
      <span>网站内容符合中国大陆法律法规</span>
    </label>
    <p id="instructions" class="hidden">勾选后展示评论区发送申请</p>
  </form>
</div>
          <?php $this->need('public/article.php'); ?>
<div id="Joe">
    <?php $this->need('public/header.php'); ?>
    <div class="joe_container">
      <div class="joe_main">
        <div class="joe_detail" data-cid="<?php echo $this->cid ?>">
          <?php $this->need('public/batten.php'); ?>
          <div class="form-container">
  <form id="conditionsForm">
       <h2 class="center-text">请勾选你符合的条件：</h2>
    <label>
      <input type="checkbox" name="condition[]" value="added_friend_link">
      <span>我已添加 故渊渡 博客的友情链接</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="personal_blog"> 
      <span>我的链接主体为 个人，网站类型为博客</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="accessible_in_cn"> 
      <span>我的网站现在可以在中国大陆区域正常访问</span>
    </label>
    
    <label>
      <input type="checkbox" name="condition[]" value="accessible_fl"> 
      <span>我接受并同意本站相关规则及政策</span>
    </label>

    <label>
      <input type="checkbox" name="condition[]" value="compliant_laws">
      <span>网站内容符合中国大陆法律法规</span>
    </label>
    <p id="instructions" class="hidden">勾选后展示评论区发送申请</p>
  </form>
</div>
          <?php $this->need('public/article.php'); ?>

{mtitle title=” CSS “/}


                    <style>
                        /* BLOG.HEYLIE.CN基础样式 */
                        body {
                            position: relative;
                            min-height: 100%;
                            background: var(--heo-background);
                            color: var(--heo-fontcolor);
                            font-size: 16px;
                            font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei";
                            line-height: 2;
                            -webkit-tap-highlight-color: transparent;
                            margin: 0
                        }
                        .form-container {
                            max-width: 800px;
                            margin: auto;
                        }
                        .center-text {
                            text-align: center;
                        }
                        #conditionsForm {
                            margin-bottom: 20px;
                            font-size: 16px;
                            border: 1px solid #ccc;
                            padding: 15px;
                            background-color: #f9f9f9;
                            border-radius: 5px;
                        }
                        #conditionsForm label {
                            display: block;
                            margin-top: 10px;
                            cursor: pointer;
                        }
                        #conditionsForm input[type="checkbox"] {
                            margin-right: 8px;
                            vertical-align: middle;
                        }
                        #conditionsForm input[type="checkbox"]:checked+span {
                            color: green;
                            font-weight: bold;
                        }
                        #conditionsForm label:hover {
                            background-color: #e0e0e0;
                            padding-left: 5px;
                        }
                        #instructions {
                            text-align: center;
                            opacity: 0.5;
                            /* 默认透明度为0.5 */
                            transition: opacity 0.3s ease-in-out;
                        }
                        .hidden {
                            opacity: 0;
                            pointer-events: none;
                            /* 阻止鼠标事件 */
                        }
                    </style>
                    <style>
                        /* BLOG.HEYLIE.CN基础样式 */
                        body {
                            position: relative;
                            min-height: 100%;
                            background: var(--heo-background);
                            color: var(--heo-fontcolor);
                            font-size: 16px;
                            font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei";
                            line-height: 2;
                            -webkit-tap-highlight-color: transparent;
                            margin: 0
                        }

                        .form-container {
                            max-width: 800px;
                            margin: auto;
                        }

                        .center-text {
                            text-align: center;
                        }

                        #conditionsForm {
                            margin-bottom: 20px;
                            font-size: 16px;
                            border: 1px solid #ccc;
                            padding: 15px;
                            background-color: #f9f9f9;
                            border-radius: 5px;
                        }

                        #conditionsForm label {
                            display: block;
                            margin-top: 10px;
                            cursor: pointer;
                        }

                        #conditionsForm input[type="checkbox"] {
                            margin-right: 8px;
                            vertical-align: middle;
                        }

                        #conditionsForm input[type="checkbox"]:checked+span {
                            color: green;
                            font-weight: bold;
                        }

                        #conditionsForm label:hover {
                            background-color: #e0e0e0;
                            padding-left: 5px;
                        }

                        #instructions {
                            text-align: center;
                            opacity: 0.5;
                            /* 默认透明度为0.5 */
                            transition: opacity 0.3s ease-in-out;
                        }

                        .hidden {
                            opacity: 0;
                            pointer-events: none;
                            /* 阻止鼠标事件 */
                        }
                    </style>
                    <style>
                        /* BLOG.HEYLIE.CN基础样式 */
                        body {
                            position: relative;
                            min-height: 100%;
                            background: var(--heo-background);
                            color: var(--heo-fontcolor);
                            font-size: 16px;
                            font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei";
                            line-height: 2;
                            -webkit-tap-highlight-color: transparent;
                            margin: 0
                        }

                        .form-container {
                            max-width: 800px;
                            margin: auto;
                        }

                        .center-text {
                            text-align: center;
                        }

                        #conditionsForm {
                            margin-bottom: 20px;
                            font-size: 16px;
                            border: 1px solid #ccc;
                            padding: 15px;
                            background-color: #f9f9f9;
                            border-radius: 5px;
                        }

                        #conditionsForm label {
                            display: block;
                            margin-top: 10px;
                            cursor: pointer;
                        }

                        #conditionsForm input[type="checkbox"] {
                            margin-right: 8px;
                            vertical-align: middle;
                        }

                        #conditionsForm input[type="checkbox"]:checked+span {
                            color: green;
                            font-weight: bold;
                        }

                        #conditionsForm label:hover {
                            background-color: #e0e0e0;
                            padding-left: 5px;
                        }

                        #instructions {
                            text-align: center;
                            opacity: 0.5;
                            /* 默认透明度为0.5 */
                            transition: opacity 0.3s ease-in-out;
                        }

                        .hidden {
                            opacity: 0;
                            pointer-events: none;
                            /* 阻止鼠标事件 */
                        }
                    </style>

{mtitle title=” JavaScript “/}


                    <script>
                        // 监听所有复选框的变化
                        document.querySelectorAll('#conditionsForm input[type="checkbox"]').forEach(function (checkbox) {
                            checkbox.addEventListener('change', checkConditions);
                        });
                        function checkConditions() {
                            // 获取所有的条件复选框
                            var conditions = document.getElementsByName('condition[]');
                            var allChecked = true;
                            // 检查是否有未选中的复选框
                            for (var i = 0; i < conditions.length; i++) {
                                if (!conditions[i].checked) {
                                    allChecked = false;
                                    break;
                                }
                            }
                            // 根据复选框的状态显示或隐藏评论区
                            var commentsSection = document.getElementById('comments');
                            commentsSection.style.display = allChecked ? 'block' : 'none';
                        }
                    </script>
                    <script>
                        // 监听所有复选框的变化
                        document.querySelectorAll('#conditionsForm input[type="checkbox"]').forEach(function (checkbox) {
                            checkbox.addEventListener('change', checkConditions);
                        });

                        function checkConditions() {
                            // 获取所有的条件复选框
                            var conditions = document.getElementsByName('condition[]');
                            var allChecked = true;

                            // 检查是否有未选中的复选框
                            for (var i = 0; i < conditions.length; i++) {
                                if (!conditions[i].checked) {
                                    allChecked = false;
                                    break;
                                }
                            }

                            // 根据复选框的状态显示或隐藏评论区
                            var commentsSection = document.getElementById('comments');
                            commentsSection.style.display = allChecked ? 'block' : 'none';
                        }
                    </script>
                    <script>
                        // 监听所有复选框的变化
                        document.querySelectorAll('#conditionsForm input[type="checkbox"]').forEach(function (checkbox) {
                            checkbox.addEventListener('change', checkConditions);
                        });

                        function checkConditions() {
                            // 获取所有的条件复选框
                            var conditions = document.getElementsByName('condition[]');
                            var allChecked = true;

                            // 检查是否有未选中的复选框
                            for (var i = 0; i < conditions.length; i++) {
                                if (!conditions[i].checked) {
                                    allChecked = false;
                                    break;
                                }
                            }

                            // 根据复选框的状态显示或隐藏评论区
                            var commentsSection = document.getElementById('comments');
                            commentsSection.style.display = allChecked ? 'block' : 'none';
                        }
                    </script>

{/hide}

温馨提示：本文最后更新于2024-08-31 01:06:00，某些文章具有时效性，若有错误或已失效，请在下方留言或联系站长。

站内部分内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供网络资源分享服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，请联系我们一经核实，立即删除。并对发布账号进行永久封禁处理。在为用户提供最好的产品同时，保证优秀的服务质量。

本站仅提供信息存储空间,不拥有所有权,不承担相关法律责任。

THE END

分享源码
# JavaScript # 友链 # 原创

评论共10条

请登录后发表评论

登录注册

- 酷小呵
  博主的分享总是那么精准到位，感谢你的专业知识
  1个月前回复
- 114514
  你的博客是我每天都会光顾的地方，因为我知道这里总有我需要的知识
  5个月前回复
- 寻梦xunm
  这篇文章内容真的太棒了真是我需要的信息
  5个月前回复
- sdfg
  看过那么多博客，我还是最喜欢你的，因为你总是能给我带来新的启示
  5个月前回复
- jzhutivopp
  很平凡不漂亮但还是把xxx留在身边了.
  5个月前回复
- wdnorrihik
  怎么收藏这篇文章？
  6个月前回复
- - 故渊渡
    CTRL+D即可收藏！
    6个月前@wdnorrihik回复
- gkayadmgbs
  怎么收藏这篇文章？
  6个月前回复
- - 测试
    CTRL+D即可收藏！
    6个月前@gkayadmgbs回复
- 6666
  你是一个拥有独立思考能力的人，我相信你会走得更远
  6个月前回复