提交表单并使用值（JavaScript）

Question

您如何使用javascript表单“提交”的值？

事实：
这是一个PHP文档
我使用JavaScript是因为我需要一些时序因素，但我认为我无法从serverside-scripts获得:)

为了简化 我想要的是，在提交此表单或单击按钮时：

<form method="POST" action="test.php">
<input type="text" name="foo" size="30">
<input type="submit" value="Click me"> //it doesn't have to be submitted
<input type="button" action="some_action" value="Click me"> //an alternative solution
</form>

名为“ foo”的文本输入的值显示在其他位置。

注意表单不必提交，我真正想要的是，当您按下按钮时，该值可以在其他地方使用

我应该改用GET吗？ 我可以只使用$ _POST数组吗？ 我应该使用AJAX（我完全没有用）吗？ 在这种情况下，我不知道该怎么办。

Answer 1

您可以从服务器端的$_POST或$_REQUEST数组中读取值，然后将其插入到您喜欢的任何位置的输出中，即使您愿意，也可以将其插入到javascript中。 例：

<?php
$myValue = $_POST['foo'];
?>
<script type="text/javascript"><!--
function writeMyValue() { document.write('<?php echo $myValue; ?>'); }
// --></script>

Answer 2

由于您提到它并不完全取决于是否提交表单，因此在没有POST / GET表单的情况下获取值更加容易。 在主体部分中编写接口逻辑后，您需要在页脚末尾编写以下代码：-

anypage.php ：-

<form method="POST" action="test.php">
  <input type="text" name="foo" id="foo" size="30" />
  <input type="submit" onclick="return writeFoo('foo_placeholder', 'foo');" value="Click me" /> //it doesn't have to be submitted
  <input type="button" onclick="return writeFoo('foo_placeholder', 'foo');" action="some_action" value="Click me" /> //an alternative solution
</form>

上面的代码仅对您的代码进行了一些小的修改，包括在按钮/提交的“ click”事件上调用JS函数“ writeFoo() ”。 该函数有两个参数：

arg提到要在其中打印值的HTML元素的目标占位符ID。
source -它提到的HTML元素，从该值是被抓取/截取的源ID。

rightpart.php ：-

<div>
    <span id="foo_placeholder"></span>
</div>

上面的HTML代码可用于任何面板，但在向用户显示“ anypage.php”页面时必须将其包括在内。 这是因为在调用“ foo”元素时必须存在占位符元素。 请注意在此页面的调用时间＆的“ writeFoo() ”函数中都使用相同的ID。

footer.php ：-

<script type="text/javascript"><!--
function writeFoo(arg, source) {
    if(document.getElementById(arg) != null) {
        document.getElementById(arg).innerHTML = document.getElementById(source).value;
    }
}
// --></script>

并且此页面应包含上面的JS代码，其中包含“ writeFoo() ”函数的定义。

编辑，至于@Latze：-
看看你能包括“ rightpart.php ”页无论是在“同一块anypage.php ”页面或任何其他页面（如“任何块header.php ” /“ footer.php ”页）。 但是主要的逻辑是，当您查看特定页面时，必须同时显示源ID（从中获取值）和目标/占位符ID（在其中显示值）（在这种情况下，这意味着当您查看“ anypage.php ”页面时）。

希望能帮助到你。

Answer 3

PHP在服务器上运行。 JavaScript在浏览器上运行。 这两种语言互不交谈； 它们甚至不会同时运行，更不用说在同一台机器上运行了。 一旦用户提交了表单，浏览器就会从服务器请求test.php ，并且当前页面，脚本和所有内容都将永远消失。

真的很难弄清楚您想做什么，因此我将向您提供一些一般性提示：

JavaScript可以拦截表单提交。 您需要将onsubmit事件处理程序附加到<form>元素。 分配给该事件的函数可以执行所需的任何操作，然后返回true （使提交继续进行）或返回false （并取消提交）。
JavaScript可以读写几乎任何页面元素。 您需要使用所谓的DOM方法。
PHP可以生成您需要的任何内容，包括HTML输入字段。

例：

<?php

$foo_value = date('Y-m-d H:i:s');

?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<script type="text/javascript"><!--
window.onload = function(){
    var documentForms = document.getElementsByTagName("form");
    for(var i=0, len=documentForms.length; i<len; i++){
        documentForms[i].onsubmit = function(e){
            var currentForm = e.target;
            var fooValue = currentForm.elements.foo.value;

            var p = document.createElement("p");
            p.appendChild(document.createTextNode("Aborted submission: " + fooValue));
            currentForm.appendChild(p);

            return false;
        };
    }
};
//--></script>
</head>
<body>

<form method="POST" action="test.php">
<input type="text" name="foo" value="<?php echo htmlspecialchars($foo_value) ?>" size="30">
<input type="submit" value="Tryk her">
</form>

</body>
</html>

更新

关于此的一点说明：

documentForms[i].onsubmit = function(e){
};

分配事件处理程序时，规范要求，每当调用该函数时，它将接收一个事件对象作为其第一个参数。 该对象代表触发函数调用的事件，它可用于获取其他信息，例如触发事件的原始DOM节点。 在函数中如何调用都无关紧要； 我用e是因为我永远不知道该如何命名:)

提交表单并使用值（JavaScript）

问题描述

3 个解决方案

解决方案1
1 2010-08-10 10:30:43

解决方案2
1 已采纳 2010-08-10 10:47:51

解决方案3
1 2010-08-10 10:49:07

更新

提交表单并使用值（JavaScript）

问题描述

3 个解决方案

解决方案1 1 2010-08-10 10:30:43

解决方案2 1 已采纳 2010-08-10 10:47:51

解决方案3 1 2010-08-10 10:49:07

更新

解决方案1
1 2010-08-10 10:30:43

解决方案2
1 已采纳 2010-08-10 10:47:51

解决方案3
1 2010-08-10 10:49:07