将 JavaScript 变量传递给 HTML 输入框并（在 PHP 文件中使用）

Question

我正在尝试将 JavaScript 变量传递给隐藏输入按钮的值，以便在我的 PHP 文件输出中使用。

我的 HTML 是：

<input type = "hidden"  id = "location2" name = "location2" value = ""/>

我在 "Submit Form" 输入中使用这个 onclick="myFunction();" 到运行函数，因为它无法在 window.load() 中完成

下面我的 JavaScript 是从另一个函数调用索引并将文本分配给变量 'location'（我知道这听起来很奇怪，但这是迄今为止我让它工作的唯一方法):

function myFunction() {
var x = document.getElementById("box2").selectedIndex;
var y = document.getElementById("box2").options;
var location=(y[x].text);

 document.getElementById("location2").value=(location);

 }

任何帮助将不胜感激，因为我真的很挣扎并且已经为此工作了一段时间（正如你可能会说的那样，我真的不知道我在做什么） - 我只需要调用值将此变量添加到我的 PHP 文件输出中，并且我的大部分 Web 表单已完成。

非常感谢

马库斯

我刚刚更改了我的 HTML 如下我已经从提交中删除了 myFunction

我添加了以下 HTML 按钮：

 <button onclick="myFunction();" id = "location2" name = "location2" value="">Click me</button>

变量正在传递中!!!!唯一的问题是当我按下 onclick 按钮时，它正在提交我的表单！

我可以用这段代码替换我以前的提交按钮吗？

感谢大家对此的帮助！！

Answer 1

是的，默认情况下使用按钮标签很好，它的作用类似于表单标签内的提交按钮。您还可以使用属性 type='button'.

使其像按钮一样（不会提交表单）

已编辑

button 或 input type='submit' 只有放在 form 标签内（没有 javascript）才能提交 form。

<form action='http://www.whosebug.com/'>
  <button>Whosebug</button> <!-- this works -->
</form>

<form action='http://www.whosebug.com/'></form>
<button>Whosebug</button><!-- this won't work -->

var go = function() {
  document.forms[0].submit();
};

<form action='http://www.whosebug.com/'></form>
<button onclick='go()'>Whosebug</button><!-- still works -->

Answer 2

我不确定你在做什么，但下面的例子可能对你有帮助。它将 post 值以及选项文本。

这里我们使用 print_r 从 AJAX 请求打印 $_POST 数组。使用此方法，您应该能够调试问题。

<!DOCTYPE html>
<html>
<body>
<?php if($_POST) { 
    print_r($_POST); die;
} ?>
<form name="" id="" method="post" >
Select a fruit and click the button:
<select id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option>Pineapple</option>
  <option>Banana</option>
</select>
<input type = "hidden"  id = "location2" name = "location2" value = ""/>
<input type = "hidden"  id = "locationname" name = "locationname" value = ""/>
<button type="submit" id="submit">Display index</button>
</form>
<script>
function myFunction() {
    var x = document.getElementById("mySelect").selectedIndex;
    var y = document.getElementById("mySelect").options;
        //alert("Index: " + y[x].index + " is " + y[x].text);
    document.getElementById("location2").value=(y[x].index);
        document.getElementById("locationname").value=(y[x].text);
    //alert($("#location2").val());
}

var submit = document.getElementById('submit');
submit.onsubmit = function(e){
    myFunction();
};


</script>
</body>
</html>

Answer 3

我假设您的表单方法是 'POST' 并且操作值与您期望看到 'location2' 隐藏输入值的 php 页面相同，如果那是在这种情况下，您可以使用 $_POST['location2'] 获取该 php 页面中的值。

将 JavaScript 变量传递给 HTML 输入框并（在 PHP 文件中使用）

pass JavaScript variable to HTML input box and (to use in PHP file)

html

javascript

php

variables