5

PHP変数であるパラメーターを使用してJavaScript関数を呼び出そうとしています。私は2つのアプローチを試みました。

  1. echo ieのスクリプトタグを使用してPHPでJavaScript関数を呼び出す

    <?php
    echo '<script>initialize('.$lat.','.$lang.','.$zom.');</script>';
    ?>
    
  2. PHP 変数の値を JavaScript 変数に割り当てる

    <スクリプト>
     var lat="<?php echo $lat;?>";
     var lang="<?php echo $lang; ?>";
     var zoom="<?php echo $zoom; ?>";
     アラート (緯度 + 言語 + ズーム);
     初期化(緯度、言語、ズーム);
     </script>
     

最初のケースでは、ページソースからクロスチェックしたときに関数が呼び出されましたが、渡されたパラメーターは未定義です。2 番目のケースでは、値が JavaScript 変数に正常に保存され、alert() で確認しますが、関数は呼び出されません。

コード全体は次のとおりです。

<!DOCTYPE html>

<html>

<head>

    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">

    </script>
<?php
     if(  isset($_POST['lat']) && isset($_POST['lang']) && isset($_POST['zoom']) && isset($_POST['city'])):

        $lat=$_POST['lat']; 

        $lang=$_POST['lang'];

        $zoom=$_POST['zoom'];

        $city=$_POST['city'];
        $zom=(int)$zoom;
              var_dump($lang);
        var_dump($lat);
        //var_dump($zoom);
              var_dump($zom);
          //echo '<script>initialize('.$lat.','.$lang.','.$zom.');</script>';

    endif;

?>          


<script>
var lat="<?php echo $lat; ?>";
var lang="<?php echo $lang; ?>";
var zoom="<?php echo $zoom; ?>";
alert(lat+lang+zoom);
initialize(lat,lang,zoom);
</script>

    <script>


function initialize(a,b,zom){        

    if (!a || !b ||!zom){ 
    alert('came on not' +a+b +zom);

    //      var centerLoc=new google.maps.LatLng( 33.61701054652337,73.37824736488983);

          zoom=16;

    }

    else

    {
        alert('came');

        var zoom =parseInt(zom);

        var centerLoc=new google.maps.LatLng(a,b);

    }

       var mapProp = {

            center:centerLoc,

            zoom:zoom,

            //mapTypeId:google.maps.MapTypeId.ROADMAP

            mapTypeId:google.maps.MapTypeId.SATELLITE

       };  

       var map=new google.maps.Map(document.getElementById("googleMap") ,mapProp);

            marker=new google.maps.Marker({

                  position:centerLoc,

                  title:'Click to zoom'

             });

    google.maps.event.addListener(marker,'click',function() {

                map.setZoom(map.getZoom()+1);

                map.setCenter(marker.getPosition());

       });

            marker.setMap(map);

}

       google.maps.event.addDomListener(window, 'load', initialize);

</script>

</head>

<body style= "background-color:gainsboro;">

    <form method="POST"  action="myPage.php" >

        Enter latitude:     <input type ="text" name="lat" id="lat" / ><br/>

        Enter longitude:    <input type ="text" name="lang"  id="lang"/ ><br/>

        Enter City Name:    <input type="text" name="city" id="city"/><br/>

        Enter Zoom level:   <input type ="text" name="zoom"  id="zoom"/ ><br/>

                        <input type="button" value ="Perview" onclick=" initialize(

                     document.getElementById('lat').value,

                     document.getElementById('lang').value,

                     document.getElementById('zoom').value)"/>

                        <input type="Submit"  value="Save" />

    </form>

                        <center><div id="googleMap"  style="width:1000px;height:500px;"></div></center>

</body>

</html>
4

4 に答える 4

6

を使用しjson_encode()ます。そうしないと、データが PHP から HTML/JS レイヤーに渡されるときに、データを誤ってエスケープする可能性が常にあります。

$vars = array($lat, $lang, $zoom);
// JSON_HEX_TAG and JSON_HEX_AMP are to remove all possible surprises that could be
// caused by vars that contain '</script>' or '&' in them. The rules for 
// escaping/encoding inside script elements are complex and vary depending 
// on how the document is parsed.
$jsvars = json_encode($vars, JSON_HEX_TAG | JSON_HEX_AMP);

echo "<script>initialize.apply(null, $jsvars)</script>";

一般に、正気を保つために、現在のページで実行されている js で使用できるようにする必要がある PHP 内のすべてのデータは、単一の PHP 配列に収集してから、単一の js オブジェクトに配置する必要があります。例えば:

<?php
$jsdata = array(
   'formvars' => array(
                      'lat' => $lat,
                      'lang' => $lang,
                      'zoom' => $zoom
    ),
   'username' => $username,
   'some_other_data' => $more stuff
);
?>
<script>
  var JSDATA = <?=json_encode($jsdata, JSON_HEX_TAG | JSON_HEX_AMP )?>;
  initialize(JSDATA.formvars.lat, JSDATA.formvars.lang, JSDATA.formvars.zoom);
</script>

これで、JS レイヤーと PHP/HTML レイヤーの間の接点が 1 つだけになり、JS 名前空間に何を入れているかを簡単に追跡できます。

于 2013-03-24T20:20:08.060 に答える
2

ブラウザが JavaScript の読み込みを終了したら、関数を呼び出します。

<script>
     window.onload = function() {
         var lat="<?php echo $lat; ?>";
         var lang="<?php echo $lang; ?>";
         var zoom="<?php echo $zoom; ?>";
         alert(lat+lang+zoom);
         initialize(lat,lang,zoom);
     };
</script>
于 2013-03-24T20:01:44.890 に答える
0

Calling a javascript function from phpでいくつかの本当に良い例を見つけました。PhpFiddle.orgでオンラインでコードを実行することもできるようです。

リンクが壊れた場合に備えて、以下に例を示します。

例 1: パラメータなしで呼び出す

<?php
echo "<a href='http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/'>Full example at: http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/</a>";
echo "<p>Add whatever PHP you want here...</p>";
?>
<!--This JS function can be defined here or a separate file since so long as it gets created in JS space'-->
<script>
    function callAlert(){
        alert('A alert without a parameter');
    }
</script>
<script>
    callAlert();
</script>
<?php
?> 

例 2: 単一パラメーターでの呼び出し

<?php
echo "<a href='http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/'>Full example at: http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/</a>";
echo "<p>Add whatever PHP you want here...</p>";

//Data that is going to be passed into the JavaScript function. Try to keep all vars together so
//that it's easier to track down the php/javascript interaction
$jsdata = 'MyName';
?>
<!--This JS can be here or a separate file since all it's doing is defining a function in the JS space'-->
<script>
    function callAlert(text){
        alert(text);
    }
</script>
<!--This JS must be defined with the php since it's using previously defined php variables -->
<script>
    var JSDATA = <?=json_encode($jsdata, JSON_HEX_TAG | JSON_HEX_AMP )?>;

    //Prompt using a single var
    callAlert(JSDATA);
</script>
<?php
?>

例 3: パラメーターの配列を使用した呼び出し

<?php
echo "<a href='http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/'>Full example at: http://www.hoverdroids.com/2015/06/10/calling-a-javascript-function-from-php/</a>";
echo "<p>Add whatever PHP you want here...</p>";

$myname = 'MyName';
$yourname = 'YourName';

//Data that is going to be passed into the JavaScript function. Try to keep all vars together so
//that it's easier to track down the php/javascript interaction
$jsdata = array(
                'input' => $myname,
                'array_input' => array(
                                        'name' => $yourname
                ),
);
?>
<!--This JS can be here or a separate file since all it's doing is defining a function in the JS space'-->
<script>
    function callAlert(text){
        alert(text);
    }
</script>
<!--This JS must be defined with the php since it's using previously defined php variables -->
<script>
    var JSDATA = <?=json_encode($jsdata, JSON_HEX_TAG | JSON_HEX_AMP )?>;

    //Prompt using a single var in the array
    callAlert(JSDATA.input);


    //Prompt using a var from a nested array    
    callAlert(JSDATA.array_input.name);
</script>
<?php
?>
于 2015-06-18T19:27:18.927 に答える