用 php 回显 javascript 是不是不好的做法 - Is it bad practice to echo javascript with php

我有一个使用Listener类的php应用程序，它基本上只是使用jquery设置一个ajax请求（下面的示例）。但出于某种原因，回显 javascript 似乎不优雅。更好的做法是为要传递给的 javascript 构建一个单例类（这可能会引入耦合）还是像我现在所做的那样只是回显脚本？

这是我正在做的事情的代码片段。

<?php
        $script = "
                    <script>
                    $(document).ready(function(){
                        $('".$trigger."').".$action."(function() {
                        ".$js_variables."
                            var ajax_load = '';
                            var loadUrl = '".$this->controller_path."';
                            var action = $(this).attr('id');
                            $('".$this->parent."')
                            .hide(2)
                            .html(ajax_load)  
                            .load(loadUrl, {action: action, ".$post_mapper."})
                            .fadeIn(800);
                        });
                    });
                </script>
        ";
      echo $script;
?>

编辑：使用单例类还可以让我只使用一次$(document).ready()或快捷方式版本$(function(){})而不是每次添加侦听器时。但我不确定这是否值得额外的时间和精力......有什么想法吗？

用 php 回显 JavaScript 是一种不好的做法吗？

一般：是

从

php 回显 JavaScript 是一种常见的做法，但我非常不鼓励这样做。

在大多数情况下，您可以通过遵循前端 MVC 结构来避免混合语言：

HTML 属于 .html * 文件。这是模型。
CSS 属于.css文件。是风景。
JS属于.js文件。它是控制器。

我

发现我很少需要从服务器端语言生成JavaScript。大多数时候，我真正需要的是传递JavaScript可以使用的信息。

而不是尝试输出：

<a href="#" id="foo">bar</a>
<script>
    $('#foo').click(function () {
        $.ajax('http://example.com')...
        return false;
    });
</script>

对于每个链接，请尝试使用本机 HTML 属性来完成大部分繁重的工作：

<a href="http://example.com/" class="ajax-link">bar</a>

在您的脚本中，您可以拥有：

$(document).on('click', '.ajax-link', function () {
    $.ajax($(this).attr('href'))...
    return false;
});

委托函数只需要绑定一次，并且可以从静态JS文件完成，而无需尝试将JS注入PHP代码。

如果需要传递更多信息，请将data-*属性与.data(...)结合使用。

_{* 或 .php 或用于模板的任何其他服务器端语言。}

从服务器回显客户端代码有一些利基原因。例如，为 JSONP API 生成 JSON，您需要在其中动态生成回调。

如果你没有一个很好的理由来使用服务器端语言生成JS，那就不要。

mm 这都是偏好...我通常会这样做，这样我的文本编辑器就能够确定什么是javascript，什么是PHP，这样它就不会让我在尝试查看非代码颜色的文本时流血。

<script>
    $(document).ready(function(){
        $('<?php echo $trigger ?>').<? echo $action ?>(function() {
            <?php echo $js_variables ?>
            var ajax_load = '';
            var loadUrl = '<?php echo $this->controller_path ?>';
            var action = $(this).attr('id');
            $('<?php echo $this->parent ?>')
                .hide(2)
                .html(ajax_load)  
                .load(loadUrl, {action: action, <?php echo $post_mapper ?>})
                .fadeIn(800);
            });
    });
</script>

一如既往，这取决于。如果你正在编写一个小的应用程序，这种混合物不会伤害你。当应用程序增长到一定大小时，我个人发现当我不在一个文件中混合语言时，它更容易维护。

历史告诉我们，前端不要在一个文件中混合HTML，JavaScript和CSS。最好将它们分开，否则当您尝试跟踪错误时，很难找到正确的位置来查看。混合JavaScript和服务器端语言也好不到哪里去。还有一些事情我想到我觉得还行。例如，需要具有动态值的配置或本地化文件。

在您的示例中，我宁愿将其分开。您所做的一切都可以通过HTML元素上的（数据）属性和一些DOM查找完美地完成。您似乎还需要为视图收集一些信息，这些信息最好存储在HTML中。例如： $action 这可以从表单中得出相当简单：

.HTML

<from method="POST" action="/you-name-it">
  ...
</form>

.JS

$(function(){
    var form = $('form');
    $.ajax( {
      type: "POST",
      url: form.attr( 'action' ),
      data: form.serialize(),
      success: function( response ) {
        console.log( response );
      }
    } );
});

提交这种确切形式的逻辑可以是JavaScript和/或PHP。他们如何沟通并不重要。

这是完全可以接受的，但有些风险 - 您正在即时生成JS的一部分，这意味着您必须生成有效的JS代码，否则整个代码块将被语法错误杀死。

例如，如果您使用 PHP 在 JS 代码块中插入 PHP 变量的值，如下所示：

<script type="text/javascript">
var last_name = '<?php echo $last_name ?>';
</script>

而 $last_name 恰好是 O'Brien ，您现在引入了语法错误，因为生成的代码将是：

var last_name = 'O'Brien';
                ^^^--- string with contents O
                   ^^^^^--- unknown/undefined variable Brien
                  ^^--string followed by variable, but no operator present.
                        ^--- start of a new unterminated string containing a ;

每当你将基于 PHP 的原始数据插入到 Javascript 变量中时，基本上必须使用 json_encode（），它保证生成的 JS 数据在语法上是有效的 JS 代码：

var last_name = <?php echo $last_name ?>;

请注意，我没有在这个版本中投入任何' - json_encode为您处理。