如何根据 PHP 变量中的值显示 div

Question

我正在尝试显示一个包含文件上传输入的 div，我需要遵守的规则是仅当状态等于 1 时才显示 div，否则它会隐藏它。

我在名为 $status 的 PHP 变量中声明了状态，以隐藏 div 我使用 display='none'.

以下是我在Javascript函数中使用的验证码。

function showFileInput (){
    var element = document.getElementById('content');
    if ($status == '1'){
        element.style.display='block';
    }else{
        element.style.display='none';
    }
}

在我的 HTML 代码中，我想在状态等于 1 时显示以下 div。

<div id="content" class="form-group row">
                <label for="fileToUpload" class="col-sm-3 col-form-label">File Upload:</label>
              <div class="col-sm-8">
                <input type="file" name="fileToUpload" id="XmlToUpload" class="btn" accept=".xml" onchange="ValidateFile()" required="">
              </div>
          </div>

请务必注意，我使用事件 onchange 进行上传文件时使用的其他附加验证。

根据我之前的情况，当状态不为1时，div仍然没有隐藏，它继续显示。我在验证中有什么地方做错了还是我需要额外的？

Answer 1

您不能在 JavaScript 中直接引用 PHP 变量。您需要让 PHP 回显该变量。使用 json_encode() 确保 PHP 值被正确编码为 JS 文字。

function showFileInput (){
    var element = document.getElementById('content');
    if (<?php echo json_encode($status); ?> == '1'){
        element.style.display='block';
    }else{
        element.style.display='none';
    }
}

Answer 2

您可以像这样直接检查 CSS 中的 $status 变量。

如果 $status 未设置为 1，此代码将隐藏该元素，如果是，则显示它。

<div style="<?php echo $status == 1 ? "display:block;" : "display:none;" ?>">My content</div>

Answer 3

您可以使用以下代码执行此操作：

<?php if($status == 1) { echo '<div id="content" class="form-group row">
    <label for="fileToUpload" class="col-sm-3 col-form-label">File Upload:</label>
    <div class="col-sm-8">
      <input type="file" name="fileToUpload" id="XmlToUpload" class="btn" accept=".xml" onchange="ValidateFile()" required="">
    </div>
</div>'; } ?>

这只会在状态等于 1 时将 div 添加到页面，而不是隐藏它，如果您根本不想在状态等于 1 之前访问它，这会很有用到 1.

如何根据 PHP 变量中的值显示 div

How to show div depending on the value in a PHP variable

html

javascript

php