将 php post 数据传递给 javascript 的方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11798995/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ways to pass php post data to javascript
提问by tom c
So I was wondering, if I have a simple php form that posts information to a certain variable, how can I pass that posted variable to javascript and be able to manipulate the data? The only way I've figured out is by using inline javascript with php but I feel there must be a cleaner and more elegant way to do it where the variables don't show up so blatantly in the source code and are handled externally.. Here's what I'm playing around with right now:
所以我想知道，如果我有一个简单的 php 表单将信息发布到某个变量，我如何将发布的变量传递给 javascript 并能够操作数据？我想出的唯一方法是在 php 中使用内联 javascript，但我觉得必须有一种更简洁、更优雅的方法来做到这一点，其中变量不会在源代码中如此明显地显示出来，而是在外部处理..这是我现在正在玩的东西：
<form action="index2.php" method="post">
<input name="sugar" class="form" type="text" value="" />
<input name="fat" class="form" type="text" value="" />
<input name="protein" class="form" type="text" value="" />
<input type="submit" value="submit" />
</form>
Which is followed by:
紧随其后的是：
<?php
$sugar = $_POST['sugar'];
$fat = $_POST['fat'];
$protein = $_POST['protein'];
?>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var sugar = "<?php echo $sugar ?>";
var fat = "<?php echo $fat ?>";
var protein = "<?php echo $protein ?>";
</script>
<script src="test.js" type="text/javascript"></script>
</head>
Does anyone have any suggestions for alternatives I could follow? I haven't been using javascript for too long so it would be nice to know my options when dealing with a situation such as this.
有没有人对我可以遵循的替代方案有任何建议？我已经很久没有使用 javascript 了，所以在处理这样的情况时知道我的选择会很好。
回答by lonesomeday
The easiest way to do this would be simply to send a Javascript object containing all the data you sent. This can easily be accomplished by JSON-encoding $_POST:
最简单的方法是简单地发送一个包含您发送的所有数据的 Javascript 对象。这可以通过 JSON 编码轻松完成$_POST：
var data = <?php echo json_encode($_POST) ?>;
You can then access, for instance, data.fatif you sent a fatvalue in your POST request.
例如，data.fat如果您fat在 POST 请求中发送了一个值，您就可以访问。
回答by Ryan McDonough
Without using _GET as well and storing the variables in the URL you have the best solution for your requirements currently.
在不使用 _GET 并将变量存储在 URL 中的情况下，您目前拥有满足您需求的最佳解决方案。
回答by Pioul
These variables will have to be printed and visible somewhere if you want to get them to your JavaScript.
如果您想将这些变量输入到您的 JavaScript 中，则必须在某处打印并显示这些变量。
JSON-encoding them and printing them so that they're saved in a local JavaScript variable is what I've always been using:
对它们进行 JSON 编码并打印它们以便将它们保存在本地 JavaScript 变量中是我一直在使用的：
<?php
function passToJavascript($variableName, $variable){
if($variable = json_encode($variable))
echo '<script>var '. $variableName .' = '. $variable .';</script>';
}
$foo = array(
'bar1' => 1,
'bar2' => 2,
'bar3' => 3
);
passToJavascript('foo', $foo);
?>
Will print in your HTML:
将打印在您的 HTML 中：
<script>var foo = {"bar1":1,"bar2":2,"bar3":3};</script>
And that way you can pass whatever variable you want, may that be a string, a number, an array or even an "associative array".
这样你就可以传递你想要的任何变量，可能是一个字符串、一个数字、一个数组甚至一个“关联数组”。
回答by Jose Vega
I feel like the best way to pass php variables over to javascript variable is to json_encode them first. If you are passing a php array over to javascript you can't simple say
我觉得将 php 变量传递给 javascript 变量的最佳方法是首先对它们进行 json_encode。如果你将一个 php 数组传递给 javascript 你不能简单地说
var1 = <?php echo $var1; ?>
you should do it like the follwing.
你应该像下面那样做。
<?php
$arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);
?>
<script type="text/javascript">
var arr = "<?php echo json_encode($arr) ?>";
</script>
回答by Johnny5
You could write your vars in inputs and then reach these inputs with javascript
您可以在输入中写入变量，然后使用 javascript 访问这些输入
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//You already linked jquery so I use it, you could do without if necessary.
$(document).ready(function(){
var sugar = $('#sugar').val();
var fat = $('#fat').val();
var protein = $('#protein').val()
});
</script>
var sugar = "<?php echo $sugar ?>";
var fat = "<?php echo $fat ?>";
var protein = "<?php echo $protein ?>";
</script>
<script src="test.js" type="text/javascript"></script>
</head>
<body>
<input type="hidden" id="sugar" value="<?php echo $sugar ?>" />
<input type="hidden" id="fat" value="<?php echo $fat?>" />
<input type="hidden" id="protein" value="<?php echo $protein?>" />
</body>
</html>
That way your javascript can all reside in a static file.
这样您的 javascript 就可以全部驻留在静态文件中。
回答by Pevara
you could try sending your variables with GET instead of POST, and then you can access them directly from javascript like this: http://javascript.about.com/library/blqs1.htm
您可以尝试使用 GET 而不是 POST 发送变量，然后您可以像这样直接从 javascript 访问它们：http: //javascript.about.com/library/blqs1.htm
There is no way to access POST variables from javascript, as far as i know. You would have to use something like you are doing
据我所知，无法从 javascript 访问 POST 变量。你将不得不使用你正在做的事情
