javascript怎样调用php函数？

Posted 2023-04-04

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript怎样调用php函数？相关的知识，希望对你有一定的参考价值。

javascript和php是在两个不同的环境下执行的，相互之间不能直接调用。
javascript是浏览器端的脚本
php是服务器端的脚本

解决办法是：
1. 在javascript里使用ajax调用服务器端脚本，把返回的结果给javascript.
2.在php里动态输出javascript，在输出过程中可以输出php的执行结果给javascript。
例如：
echo '<script type="text/javascript">'
echo 'var id = ' . phpfunction() . ';';
echo '</script>';
这样的话id的值就是phpfunction执行的结果。
3.如果是php内置函数，网上有javascript实现的php函数脚本，实现了大多数php函数的javascript版本。参考技术A womanv 说得很清楚了
JS 是浏览器语言，PHP 是服务器语言，因此JS 无法直接调用 PHP 函数，但PHP 可以调用 JS 函数，方法是:
print("<script type='text/javascript'>alert('OK !')</script>");
如果你想用 JS 与 PHP 通信，最好的办法就是 AJAX 了，如果你只是想调用 PHP 中的变量，则把变量以隐藏域的形式存储起来，赋于 id, 以 document.getElementById('ID') 就可以引用了本回答被提问者采纳参考技术B 使用Ajax调用，网上查查Jquery调用后台函数

PHP：使用来自 php 的参数调用 javascript 函数

【中文标题】PHP：使用来自 php 的参数调用 javascript 函数【英文标题】：PHP: calling javascript function with parameters from php 【发布时间】：2013-03-14 04:40:15 【问题描述】：

我正在尝试使用 PHP 变量的参数调用 JavaScript 函数。我尝试了两种方法。

在 PHP 中使用 echo 中的脚本标签调用 JavaScript 函数即

<?php
echo '<script>initialize('.$lat.','.$lang.','.$zom.');</script>';
?>

将 PHP 变量值分配给 JavaScript 变量

在第一种情况下，当我从页面源交叉检查时调用了函数，但传递的参数未定义。并且在第二种情况下，值已成功保存在 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>

【问题讨论】：

检查 JavaScript 控制台是否有错误。当你执行echo '<script>initialize('.$lat.','.$lang.','.$zom.');</script>';时，你在生成的页面的源代码中得到了什么？尝试调试你的 js - 例如，使用 Chrome 的控制台你调用这个函数，还是它只是“存在”？您可能需要在body onload、something onclick 等中调用它。 var lang="="<?php echo $lang; ?>"; 似乎有点奇怪。 PHP处理后是什么样子的？ 【参考方案1】：

使用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 层之间只有一个接触点，因此您可以轻松跟踪您在 JS 命名空间中添加的内容。

【讨论】：

【参考方案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>

【讨论】：

感谢您的回复，但我不需要在加载窗口时调用它【参考方案3】：

只需调用预定义的 java 脚本代码，如 jsFunction() ；在你的 php 代码中

【讨论】：

【参考方案4】：

我在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
?>

【讨论】：

谁可能会否决这个答案？我提供了三个示例，这些示例以越来越复杂的方式回答了这个问题，以及为喜欢音频/视频解决方案的用户解释了这一点的视频。所以，对于投反对票的人，请解释一下，而不是跑路！！！

以上是关于javascript怎样调用php函数？的主要内容，如果未能解决你的问题，请参考以下文章

调用Javascript警报的PHP函数

如何在JAVASCRIPT调用Android JAVA函数

从 java GWT 代码调用 .js 文件的 Javascript 函数

javascript二维数组怎样排序

javascript 函数第二次调用的时候怎样获取上一次调用的返回值

PHP：使用来自 php 的参数调用 javascript 函数