将php post数据传递给javascript的方法
Ways to pass php post data to javascript
所以我想知道,如果我有一个简单的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>
后面跟着:
<?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>
有人对我可以遵循的替代方案有什么建议吗?我使用javascript的时间不长,所以在处理这样的情况时,如果知道我的选择会很好。
最简单的方法就是发送一个包含您发送的所有数据的Javascript对象。这可以通过JSON编码$_POST
:轻松实现
var data = <?php echo json_encode($_POST) ?>;
例如,如果在POST请求中发送了fat
值,则可以访问data.fat
。
如果不使用_GET并将变量存储在URL中,您就可以获得当前满足您需求的最佳解决方案。
如果您想将这些变量导入JavaScript,则必须将它们打印出来并在某个地方可见。
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);
?>
将在您的HTML:中打印
<script>var foo = {"bar1":1,"bar2":2,"bar3":3};</script>
这样,你就可以传递任何你想要的变量,可能是字符串、数字、数组,甚至是"关联数组"。
我觉得将php变量传递给javascript变量的最佳方法是首先对它们进行json_encode。如果您将php数组传递给javascript,则不能简单地说
var1 = <?php echo $var1; ?>
你应该像下面这样做。
<?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>
您可以在输入中编写vars,然后使用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>
这样一来,您的javascript就可以全部驻留在一个静态文件中。
您可以尝试使用GET而不是POST发送变量,然后您可以直接从如下javascript访问它们:http://javascript.about.com/library/blqs1.htm
据我所知,没有办法从javascript访问POST变量。您必须使用类似于正在进行的东西
- 从Javascript方法返回全局变量
- 简单的JavaScript方法链接
- 如何为javascript方法放入jquery确认对话框
- jquery插件或javascript方法自动调整文本输入(而非文本区域)(固定宽度)可变高度的大小
- 在类外重写Javascript方法,使用默认行为
- 使用 JavaScript 方法滚动
- 如何从窗体调用外部javascript方法
- 使用c#在Web服务器上运行JavaScript方法
- 如何从角度 js 调用 javascript 方法
- 在Node.js中,我在哪里可以看到JavaScript方法的源代码,例如hasOwnProperty
- 简单的javascript方法问题
- iframe未执行Javascript方法(PHP)
- Javascript 方法看不到对象变量
- 从HTML中的另一个文件访问javascript方法
- 如何测试只在闭包范围中可见的javascript方法
- 将php表转换为angularjs javascript方法
- 使用ScriptManager.RegisterStartupScript从代码隐藏调用javascript方法
- 如何从 MVC4 链接调用 Javascript 方法(错误 JavaScript 运行时错误:对象不支持此操作)
- Java eqivalent method of “splice(a,b,..)“在 JavaScript 方法中
- 在客户端 Javascript 方法之后运行服务器方法