通过 JS 设置时，引导输入验证消息不显示 php答案

【问题标题】：Bootstrap input validation message not displaying php when set through JS通过 JS 设置时，引导输入验证消息不显示 php
【发布时间】：2019-09-19 11:40:30
【问题描述】：

我正在尝试使用 bootstrap 4 在 html 表单上使用 .setCustomValidity() 和 .invalid-feedback 类设置错误消息。

因此，当用户验证表单时，JS 脚本会检查输入，如果有错误，则设置适当的消息。我想让我的网站完全多语言化，所以我制作了随浏览器语言变化的全局变量，但是在设置这些变量时，网页上没有显示任何内容，我发现我的 php 设置了围绕它的注释标签。

例如：

<div class="col-md-4">
            <input type="text" class="form-control" id="first_name" placeholder="<?php echo INP_FIRSTNAME; ?>" name="fname" autocomplete="given-name" required>
            <div class="invalid-feedback" id="fname-feedback"></div>
</div>

脚本：

let fname_feedback = document.getElementById("fname-feedback");
let fname_i = document.getElementsByName("fname")[0];

fname_feedback.innerHTML = "<?php echo FDB_LENGTH ?>";
fname_i.setCustomValidity("Not valid");

然后我的 div 包含这个而不是 FDB_LENGTH 的值：

<!--?php echo FDB_LENGTH ?-->

在设置 innerHTML 之前，我尝试从常量中设置变量，但后来什么都没有显示，所以如果有人可以帮助我或有一点修复，将不胜感激！

感谢阅读。

【问题讨论】：

标签： javascript php html bootstrap-4

【解决方案1】：

您发布的 Javascript 代码并未被解释为 PHP。如果您只是在浏览器中打开任何随机网页，选择一个随机元素，然后从浏览器控制台对其调用.innerHTML = "<?php echo FDB_LENGTH ?>"，它将表现出您所描述的行为。

我猜这个 Javascript 代码是一个 .js 文件，你的服务器没有将它解释为 PHP 文件。这是 Web 服务器的预期行为。如果你想把 PHP 的东西放在你的 Javascript 中，你必须有意识地这样做（希望不是到处都是）。例如，您可以在 .php 文件中创建内联 <script> 标记。

【讨论】：

【解决方案2】：

记住 PHP 变量前面有 $：

<div class="col-md-4">
    <input type="text" class="form-control" id="first_name" placeholder="<?php echo $INP_FIRSTNAME; ?>" name="fname" autocomplete="given-name" required>
    <div class="invalid-feedback" id="fname-feedback"></div>
</div>

脚本：

let fname_feedback = document.getElementById("fname-feedback");
let fname_i = document.getElementsByName("fname")[0];

fname_feedback.innerHTML = "<?php echo $FDB_LENGTH; ?>";
fname_i.setCustomValidity("Not valid");

【讨论】：