1

虽然是 javascript 的新手，但我需要使用 javascript 变量（一个数组）来反映用户在客户端所做的事情，然后在提交时将其发布到 PHP 服务器页面。

有人建议我将其作为值包含在表单中的隐藏字段中以发布到 php 页面。但是，由于 JS 变量是由用户动态创建的，因此除非我调用刷新页面的函数，否则我无法写入页面以包含在表单中。为避免双页刷新，我希望提交函数既获取数据又同时将其发布到 php 脚本。如果我理解正确，则不需要 AJAX，因为我可以在提交时重新加载页面。我只是不想重新加载两次。

下面使用安德鲁建议的函数来设置js变量和post。当我得到表单中的另一个隐藏变量时，表单发布，但我没有得到 js 设置的变量，可能是因为变量的命名有误。

  <html>
     <head>
    <style type="text/css">
        select
        {
            width:100px;
        }
    </style>
    <script type="text/Javascript">
        function moveToRightOrLeft(side)
        {
            if (side == 1)
            {
                var list1 = document.getElementById('selectLeft');
                var list2 = document.getElementById('selectRight');
            }
            else
            {
                var list1 = document.getElementById('selectRight');
                var list2 = document.getElementById('selectLeft');
            }

            if (list1.options.length == 0)
            {
                alert('The list is empty');
                return false;
            }
            else
            {
                var selectedItem = list1.options[list1.selectedIndex];
                move(list2, selectedItem.value, selectedItem.text);
                list1.remove(list1.selectedIndex);
                if (list1.options.length > 0)
                    list1.options[0].selected = true;
            }
            return true;
        }

        function move(listBoxTo, optionValue, optionDisplayText)
        {
            var newOption = document.createElement("option");
            newOption.value = optionValue;
            newOption.text = optionDisplayText;
            listBoxTo.add(newOption, null);
            return true;
        }

        function postData(listBoxID)
        {
            var options = document.getElementById(listBoxID).options;
            for (var i = 0; i < options.length; i++) 
            window.location = "posttoserver.php?data="+options[i].value;

        }

        function setTheValue(val) {
    var options = document.getElementById(listBoxID).options;
    var form = document.forms['myForm'];
    hiddenField = oFormObject.elements["data"];
    hiddenField.value = "val";
}
    </script>
    </head>
    <body>
    <select id="selectLeft" multiple="multiple">
        <option value="1">Value 1</option>
        <option value="2">Value 2</option>
        <option value="3">Value 3</option>
    </select>
    <button onclick="moveToRightOrLeft(2)">&lt;</button>
    <button onclick="moveToRightOrLeft(1)">&gt;</button>
    <select id="selectRight" multiple="multiple">
    </select>
    <form id="myForm" action="getdata.php" method="get">
    <input type="hidden" name="data" />
    <input type="hidden" name="mode" value="savedit">
    <button onclick="setTheValue(options)">Submit Data</button>
</form>
     </body>
     </html>

另一方面，我在 getdata.php 中：

<?php
$mode = $_REQUEST['mode'];
$option = $_REQUEST['data'];
echo $mode;
echo $option;
print_r ($option);;
?>
4

3 回答 3

1

几天后终于用 document.getElementById('varname').value 解决了它 对于像我这样的新手来说，document.getElementById 不仅仅像您想象的那样检索数据，而且大多数文档都提到了。它还设置数据。

关键是将语句向后写，并且（正如您必须做的那样检索一个值）将 id== 放入您要设置的元素中。

如果你写 var test = document.getElementById('text'); 并且您已将 id="text" 放在某个字段中，它将检索文本的值。这就是通常的文档所提到的。但是，如果你写：

document.getElementById('varname').value = "dog" 它将“dog”插入到包含 id=varname 的元素中。

虽然这对于更有经验的人来说可能是显而易见的，但它确实让我感到困惑。

以下代码有效。 

<html>
<head>
<script>

 function Post(data)
        { 
            document.getElementById('varname').value = data

        }
</script>
</head>
<body>
<form action = "" method="get">
<input id="varname" type="hidden" name="d">
<button onclick="Post('dog')">Post to Server</button>
</form>
</body>
</html>
于 2012-04-29T12:16:44.117 回答
0

您可以像往常一样创建一个带有空隐藏字段的表单：

<form id="myForm" action="posttoserver.php" method="get">
    <input type="hidden" name="data" />
    ...
    <input type="submit" value="Submit" />
</form>

您可以使用 JavaScript 函数来设置隐藏字段的值：

function setTheValue(val) {
    var form = document.forms['myForm'];
    hiddenField = oFormObject.elements["data"];
    hiddenField.value = "val";
}

然后，您可以在单击按钮时调用函数 setTheValue(val) 或其他任何内容。我希望这有帮助！

于 2012-04-27T18:19:21.630 回答
0

jQuery 实际上使这变得非常简单。你有正确的想法，但使用 window.location 会改变你的页面。您要做的是在您留在当前页面时向另一个 url 发出异步请求。

http://api.jquery.com/jQuery.ajax/

于 2012-04-27T18:22:58.767 回答