2013年3月15日 星期五

如何在Server端的PHP第一次執行時就讓JS依照PHP的不同數值而產生不同的介面

老觀念再度重複,HTML是網頁的基本主體,CSS用來述說這些主體的長相(長、寬、高、顏色等等),Javascript則功能很多:
1.可以用來讓HTML主體中可以有一些邏輯判斷,來動態的控制長相,或是產生不同的HTML主體。
2.可以作資料的判斷控制,讓資料傳送到SERVER之前,能被判斷過,有效的才會傳送到SERVER,以免浪費網路跟使用者時間。
3.還有更多的可以


這裡介紹一種前端Javascript取得後端PHP變數的用法(其實這時候沒有前後端,而是都還在後端,讓你可以在網頁第一次被載入的時候,就依照PHP的某個值(也許來自資料庫,也許經過某些邏輯判斷),來決定你的排版。


有三個程式檔(點我下載)Example-TestPhpTransParas-Main.php, Example-TestPhpTransParas.js, Example-TestPhpTransParas.css組合起來就可以讓後端的PHP的變數傳遞到Javascript檔案中,進而可以控制.css,來讓排版不同,比方某些HTML主體不顯示、顯示、變顏色、改長寬。底下的重點就在於紅色的部分,他透過PHP語法,把參數用ECHO方式吐到HTML的JavaScript片段裡然後讓JavaScript變數承接這個吐出的數值就行。

(這個範例需要RUN在Web Server上,否則沒法看到PHP的執行效果),而實際應用上,前端的JAVA跟後端的PHP的資料傳遞是透過POST跟GET的,而後期,這技術更演變成網頁上很強又很知名的技術:AJAX。相關文章在這裡。


----------------------Example-TestPhpTransParas-Main.php-----------------------------


<script language='JavaScript' type='text/JavaScript'>
isShowLabel = <?php echo $DB_Data ?>;
</script>





----------------------Example-TestPhpTransParas.js-----------------------------


$(document).ready(function ()
{
if ( 1 == isShowLabel )
{
$('.Lbl_PHP_Show').css("visibility", "visible");
}
});





----------------------Example-TestPhpTransParas.css-----------------------------
特別注意之處


沒有留言:

張貼留言