嵌入式Javascript與無脂佈局

我正在使用PHP Fat Free，並試圖創建一個佈局/子佈局系統，它最終會在某種程度上模仿MVC。我有一個擁有佔位符的主佈局（實質上後端設置了不同的子佈局或部分文件路徑，然後視圖負責調用該文件名的渲染），這一切都很好。嵌入式Javascript與無脂佈局

我遇到的問題是當我需要在我的sublayout中的內聯JavaScript運行在主佈局的腳本後（例如，在jquery include行之後）在我以前使用的框架中，我能夠輸出緩衝ob_start和ob_get_clean來抓取在sublayout然後腳本傳遞到佈局以顯示腳本線以下，我希望這是有道理的，但如果沒有，這裏是當前的代碼，我在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>

的sublayout：

<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」，並且基本上處理的ob_start和ob_get_clean部分，使得endRegion功能我的內聯腳本可以被選中，但是一旦我在子佈局中，我無法弄清楚如何將緩衝的代碼傳遞迴佈局，以便在jquery包含之後它可以被echo'd。

在你告訴我不應該使用內聯腳本之前，我知道這一點，而且我所做的大部分事情都在外部腳本文件中，我有一個包含的解決方案，但有時我需要內聯腳本，我卡住了。

有沒有辦法來處理我想要做的輸出緩衝，或者更好的是有沒有比輸出緩衝方法更好的解決這個問題的方法？

更新： 最佳做法通常決定了你應該包括在頁面底部的腳本的結束標記之前。如果我將腳本放在sublayout的上方，它會破壞我們的FE最佳實踐，並且在腳本下載時阻塞頁面的其餘部分。這就是爲什麼我想保持結構的方式，我已經注意到，而不是把jquery包含在子佈局之上。

來源

2015-06-02 tjans

我不明白是什麼問題。您的佈局是：

<!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>

來源

2015-06-02 14:15:27 num8er

感謝您的回覆。我應該澄清一下，並回答你的問題：「那麼爲什麼不把它寫成這樣？」最佳做法通常規定您應該在關閉正文標記之前的頁面底部包含腳本。如果我將腳本放在sublayout的上方，它會破壞我們的FE最佳實踐，並且在腳本下載時阻塞頁面的其餘部分。我會把它添加到原來的帖子來澄清這一點，thx爲部分的例子。我確信將來我會使用它。雖然，我不得不適應它，因爲我沒有使用F3模板 – tjans

我知道你爲什麼要這麼做。但是，如何將scripts.php文件中的腳本和HTML，php部分分離到另一個文件並根據需要呈現它們，會出現什麼問題？（：

來源

2015-06-02 14:49:45 num8er

是的，這是一個選項，也是我之前設想的一個選項。最後，這可能是處理它的方法，儘管我試圖將內聯代碼保留在正在操作的相關標記旁邊，而不必跳轉到外部文件以查看它。否則，用你提出的解決方案，我可能只是把它放在一個外部的.js文件中，並以這種方式包含它（正如我提到的，我有一個解決方案來拉取js文件，而不是內聯文件）。 – tjans

保持單獨的文件佈局代碼和js文件，最後我將所有js部分縮小並在底部包含一個js文件。 – num8er

同意，99％的時間也是我所做的。有時我會包含內聯JS，如果必須使javascript成爲動態的，就像將數據庫ID從PHP傳遞到腳本一樣。 – tjans

從谷歌組討論中，我有，有人提出了一個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>

您sublayout內：

<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

來源

2015-06-02 15:12:09 tjans

這個gg討論還提供了一個使用輸出緩衝和javascript解決方案的方法。我將把這個標記爲答案，因爲它直接用兩個可行的解決方案來解決原始問題的所有問題。感謝@ num8er以及他的幫助。 – tjans

嵌入式Javascript與無脂佈局

回答

相關問題