2016-05-07 4 views
0

私はそれについて多くを読んで、私も多くを試しました...私はほとんどそれが可能だと思うが、私はあなたの助けが必要です。画面幅のサイズに応じてPHPを含む

画面の幅に応じてコンテンツを読み込みたいとします。それは、ソーシャルネットワークの共有ボタンを備えたスティッキーなナビゲーションバーです(Facebookのように、通常通り)。

このコードを使用すると、HTMLを完全に読み込みます。しかし、その中のスクリプトはそうではありません。私はカーソルがロゴの上にあるときにボタンを表示するjQueryのアニメーションを使用し、ボタンは、うまく、仕事には、JavaScriptを使用します。しかし、このように読み込むと、そのHTMLの中にスクリプトがないようです。

$(function() { 
    var width = $(window).width(); 
    if (document.documentElement.clientWidth >= 992) 
     $('#Navbar').load('navbar.html'); 
}); 

私はPHPで試してみました。単純なinclude()が働いた。 navbarは、想定されていた方法でロードされました。

PHPは、画面の幅を知ることができないので(と私は、ブートストラップを使用しておりますので、私はそれは画面サイズです以下)、私はこれを行うことができると思った

(私はそれがすべて同じだ、.PHPするの.htmlを変更)
$('#NavBar').append('<?php include "navbar.php"; ?>'); 

しかし、動作しません。

jQueryを使用してinclude()に電話する方法はありますか?あるいはこの仕事をすることができる他の方法?

メディアクエリとdisplay: hiddenはオプションではありません。私はコンテンツを読み込んで隠しておきたくありません。必要なときにロードするだけです。

+0

[jQuery .load()呼び出しが重複していると、読み込まれたhtmlファイルのjavascriptが実行されません](http://stackoverflow.com/questions/889967/jquery-load-call-doesnt-execute-javascript-in- loaded-html-file) – Philip

+0

またはhttp://stackoverflow.com/questions/1317080/jquery-ajax-load-java-script-not-executing – Philip

+0

またはhttp://stackoverflow.com/questions/16352371/jquery-load -ajax-not-executing-javascript-in-returned-html-after-appende – Philip

答えて

0

これは2つの全く異なるプログラミング言語なので、javascriptからphp関数を呼び出すことはできません。

しかし、PHPでこの作業をするために、いくつかのパラメータや新しい種類のURLを使ってページのリロードを呼び出すことができます。

例1ページ分PHPサイト:サイト上の任意の追加のGETパラメータを持っていないとnavbar.phpが唯一の有効なHTML形式のものが含まれている場合は、上記の

<html> 
<head> 
<!--Your Stuff--> 
</head> 
<body> 
<?php 
    //access the parameter and it's value with php's global $_GET 
    if(isset($_GET["mobile"]) && $_GET["mobile"] == 992){ 
    include "navbar.php"; 
    } 
?> 
<script> 
//check if the document has the specified width and also if the parameter is already set 
if (document.documentElement.clientWidth >= 992 && window.location.href.indexOf("?mobile=992") == -1) { 
    window.location.href = window.location.href + "?mobile=992"; 
} 
</script> 
</body> 
</html> 

例は動作します。

関連する問題