Question

我正在使用PHP Fat Free，我正在尝试创建一个布局/子布局系统，最终将在某种程度上模仿MVC。我有一个主要的布局，它有占位符（基本上后端设置不同的子布局或部分文件路径，然后视图负责调用该文件名的渲染。这一切都很好。

我遇到的问题是当我需要在我的子布局中使用内联javascript在主布局中的脚本之后运行时（例如，在jquery包含行之后）。在我之前使用的框架中，我能够输出缓冲ob_start和ob_get_clean以获取子布局中的脚本，然后将其传递给布局以显示在脚本行下方。我希望这是有道理的，但如果没有，这是我在F3中使用的当前代码。

路线：

$f3->route('GET /test',
    function($f3) {
        // set the sublayout name
        $f3->set('sublayout', 'testpage.php');

        // render the whole shebang
        echo View::instance()->render('testlayout.php');
    }
);

布局：

<!DOCTYPE html>
<html>
<head>
    <title>Test Layout</title>
</head>
<body>
  <h1>Test Layout</h1>
  <?php echo View::instance()->render($sublayout) ?>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" />
  <!-- inline script should go here -->
</body>
</html>

子布局：

<h2>My Test Page</h2>
<div id='message'></div>

<script>
    // This code needs to be placed AFTER the jquery include in the main layout
    $(function(){
        $('#message').html('This is my message');
    });
</script>

我尝试扩展视图以包含一个“beginRegion”和endRegion函数，该函数基本上处理了ob_start和ob_get_clean部分，以便我的内联脚本可以被拾取，但是一旦我在子布局中，我就无法计算如何将缓冲的代码传递回布局，以便在jquery包含之后回显它。

在你告诉我我不应该使用内联脚本之前，我知道这一点，我所做的大多数事情都在外部脚本文件中，我有一个包含的解决方案，但有时候我需要它内联，那就是我在哪里我被卡住了。

有没有办法处理我正在尝试用输出缓冲做的事情，或者更好的是有没有比输出缓冲方法更好的解决方法？

更新最佳实践通常要求您应该在关闭正文标记之前的页面底部包含脚本。如果我将脚本放在子布局上面，它会破坏我们的FE最佳实践，并且在脚本下载时会阻止页面的其余部分。这就是为什么我要保持它的结构我记录的方式，而不是将jquery包括在子布局上面。

Answer 1

我不明白这是什么问题。你的布局是：

<!DOCTYPE html>
<html>
<head>
    <title>Test Layout</title>
</head>
<body>
  <h1>Test Layout</h1>
  <?php echo View::instance()->render($sublayout) ?>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" />
  <!-- inline script should go here -->
</body>
</html>

您希望在jquery使用后包含sublayout。那么为什么不写这样呢？：

<!DOCTYPE html>
<html>
<head>
    <title>Test Layout</title>
</head>
<body>
  <h1>Test Layout</h1>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" />
  <!-- inline script should go here -->
  <?php echo View::instance()->render($sublayout) ?>
</body>
</html>

您也可以编写自定义功能。让我们说你有部分文件夹或其他更结构化的文件夹，并希望使用它：

$f3->set('partial',
    function($file) {
        $file .= (strpos($file, '.php')>0)? '' : '.php';
        if(!is_file($file)) return '';
        return View::instance()->render($file);
    }
);

然后像：

一样使用它

<!DOCTYPE html>
<html>
<head>
    <title>Test Layout</title>
</head>
<body>
  <h1>Test Layout</h1>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" />
  <!-- inline script should go here -->
  {{ @partial('partials/testpage') }}
</body>
</html>

Answer 2

我知道你为什么要这样做。但是将scripts.php文件和HTML中的脚本分离到另一个文件并根据需要渲染它们的问题是什么？（：

Answer 3

在我参与的谷歌小组讨论中，有人提供了可能有效的JS解决方案：

在你的布局中

：

<head>
  <script>
  var callbacks=[];
  </script>
</head>
<body>
  <script src="...jquery.min.js"/>
  <script>
    $.each(callbacks,function(i,func){func.call(null,jQuery);}) //<< triggers all queued callbacks
  </script>
</body>

在子布局中：

<h2>My Test Page</h2>
<div id="message"></div>
<script>
  callbacks.push(function($){
    //do something with jQuery
  });
</script>

这是链接： https://groups.google.com/forum/#!topic/f3-framework/iGcDuDueN8c

具有无脂布局的内联Javascript

3 个答案: