0

我有一个添加表单元素的 appendchild 函数。在 IE 中，一切正常；能够process.php做到$_POST。但在 Firefox 中，它不发送数据。

这是我的代码。

<script type="text/javascript">
        var i=0;

        function addElement()
        {
            var ni = document.getElementById('org_div1');
            var numi = document.getElementById('theValue');
            var num = (document.getElementById('theValue').value -1)+ 2;
            numi.value = num;
            var newDiv = document.createElement('div');
            var divIdName = num;  newDiv.setAttribute('id',divIdName);

            newDiv.innerHTML = '<input type="text" name="work" /><input type="file"
class="fileupload" size="80" name="file' + (num) +'" onclick="addElement()"/> <a
  class="removelink" onclick=\'removeElement('+divIdName+')\'>Remove This File</
a>';

            // add the newly created element and it's content into the DOM
            ni.appendChild(newDiv);
        }

        function removeElement(divNum)
        {
            var d = document.getElementById('org_div1');
            var olddiv = document.getElementById(divNum);

            d.removeChild(olddiv);
        }

</script>

<td>
    <div class="file_input_wrapper">        
        <input type="hidden" value="1" id="theValue" />
        <div id='org_div1'>
            <input type="file" class="fileupload" name="file1" size="80" onclick="addElement()" />
        </div>
</td>
4

3 回答 3

0

您可以使用 PHP 的字段名称数组功能来避免跟踪您的字段名称。只需像这样命名字段：

<input type="file" name="files[]" ... />
                              ^^--- array notation

并且 PHP 将在表单提交后将每个文件框作为 $_FILES 数组中的单独成员处理。这使您免于跟踪有多少框和隐藏表单字段来存储值的所有额外开销。

您可能需要重新考虑让文件元素的 onclick 成为添加新文件输入的东西。如果有人单击“浏览”按钮添加文件会怎样？他们会得到一个新的文件输入框，即使他们可能只想要一个。如果他们选择了错误的文件或稍后改变主意并再次单击浏览以更改文件选择，他们将获得另一个输入框。

考虑使用专用的“添加另一个框”按钮。

于 2011-07-14T19:23:45.203 回答
0

只是想问一下你的表单标签在哪里？表格标签之前还是之后？我有类似的问题，我的表单标签在表格内。当我将表单标签放在表格之外时，一切正常。

网站不再工作。这是工作示例。我用了你的代码。我只改变了两件事， <input type="text" name="work[]" />而不是<input type="text" name="work" /> 你错过了一个</div>结束 div 标签

这是代码（在 IE7、IE8、FF 和 google chrome 上测试）

<?php
if (!empty($_POST['btnProsledi'])){
print_r($_POST);
echo "<br />";
print_r($_FILES);
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
    var i=0;

    function addElement()
    {
        var ni = document.getElementById('org_div1');
        var numi = document.getElementById('theValue');
        var num = (document.getElementById('theValue').value -1)+ 2;
        numi.value = num;
        var newDiv = document.createElement('div');
        var divIdName = num;  newDiv.setAttribute('id',divIdName);

        newDiv.innerHTML = '<input type="text" name="work[]" /><input type="file"  class="fileupload" size="80" name="file' + (num) + '" onclick="addElement()"/> <a class="removelink" onclick=\'removeElement(' + divIdName + ')\'>Remove This File</a>';

        // add the newly created element and it's content into the DOM
        ni.appendChild(newDiv);
    }

    function removeElement(divNum)
    {
        var d = document.getElementById('org_div1');
        var olddiv = document.getElementById(divNum);

        d.removeChild(olddiv);
    }

</script>

</head>
<body>
<form method="post" action="" enctype="multipart/form-data">
  <table>
<tr>
    <td>
    <input name="proba" type="text" id="proba" value="" />
    </td>
</tr>
<tr>
    <td>
<div class="file_input_wrapper">        
    <input type="hidden" value="1" id="theValue" />
    <div id='org_div1'>
        <input type="file" class="fileupload" name="file1" size="80" onclick="addElement()" />
    </div>
    </div>
</td>

</tr>
<tr>
    <td>
    <input name="btnProsledi" type="submit" id="btnProsledi" value="Submit" />
    </td>
</tr>
 </table>
 </form>
</body>
</html>
于 2011-07-14T21:47:11.570 回答
0

解决了问题...

基本上，我有这个..

<div>
<form>
</div>
</form>

并改成这个..

<form>
<div>
</div>
</form>

似乎 firefox 不喜欢无效的 html。

于 2011-07-19T02:32:39.387 回答