Php 当文件输入中存在name字段时，getElementById不会发布

我正在编写一个代码来浏览和上传一个文件在一个单一的步骤。 我有以下代码：

<input type="file" id="image" style="display: none;">
<input type="submit" name="upload" id="upload" value="upload"
  onclick="document.getElementById('image').click();">

此代码允许我选择文件并提交表单，但我希望使用$\u文件属性，并且由于文件输入中没有名称字段，因此我无法访问文件信息

因此，我修改了代码，添加了name字段，如下所示

<input type="file" name="image" id="image" style="display: none;" />

<input type="submit" name="upload" id="upload" value="upload"
  onclick="document.getElementById('image').click();" />

现在，有了这段代码，我仍然可以浏览文件，但它没有提交。因此，简而言之，我无法使用这两种方法访问$\u文件

有没有什么建议我可以做些什么来继续前进

---

TIA

虽然我不支持您的方法，但它不会将标记与行为分离，您可以尝试在onclick中添加返回true。

虽然我不支持您的方法，但它不会将标记与行为分离，您可以尝试在onclick中添加返回true。

此代码无法跨浏览器工作。在chrome上，您不能调用单击隐藏的输入[type=file]元素

即使将其切换为visible，在onclick或onsubmit处理程序中单击也不会起作用-表单将不会以新文件值提交。这是一个安全特性。浏览器不希望您这样做

---

Flash可以做你想做的事。查看YUI Uploader组件：

此代码无法跨浏览器工作。在chrome上，您不能调用单击隐藏的输入[type=file]元素

即使将其切换为visible，在onclick或onsubmit处理程序中单击也不会起作用-表单将不会以新文件值提交。这是一个安全特性。浏览器不希望您这样做

---

Flash可以做你想做的事。查看YUI Uploader组件：

如果要在不重新加载页面的情况下上载文件，请使用将文件上载到某处，并将响应传递给回调，而不传递其他内容

It does not depend on specific HTML, just give it a <input type="file">
It does not require your server to respond in any particular way
It does not matter how many files you use, or where they are on the page

-甚至-

$('input[type="file"]').ajaxfileupload({
  'action': '/upload.php',
  'params': {
    'extra': 'info'
  },
  'onComplete': function(response) {
    console.log('custom handler for file:');
    alert(JSON.stringify(response));
  },
  'onStart': function() {
    if(weWantedTo) return false; // cancels upload
  },
  'onCancel': function() {
    console.log('no file selected');
  }
});

---

如果您想在不重新加载页面的情况下上载文件，请使用将文件上载到某处，并将响应传递给回调，而不传递其他内容

It does not depend on specific HTML, just give it a <input type="file">
It does not require your server to respond in any particular way
It does not matter how many files you use, or where they are on the page

-甚至-

$('input[type="file"]').ajaxfileupload({
  'action': '/upload.php',
  'params': {
    'extra': 'info'
  },
  'onComplete': function(response) {
    console.log('custom handler for file:');
    alert(JSON.stringify(response));
  },
  'onStart': function() {
    if(weWantedTo) return false; // cancels upload
  },
  'onCancel': function() {
    console.log('no file selected');
  }
});

---

据我所知，您只想隐藏特定于浏览器的文件浏览控件，并提供您自己的样式按钮，同时选择并上载文件，例如，在文件浏览对话框关闭时上载照片。 在这种情况下，您需要这样的东西：

<form name="myForm" method="POST">
    <input type="file" name="image" id="image" 
        style="position: absolute; left: -1000px;"
        onchange="myForm.submit();" />
    <input type="button" name="upload" id="upload" value="upload"
        onclick="document.getElementById('image').click();" />
</form>

在Chrome中工作不会隐藏文件输入，而是将其移到页面外。如果其他浏览器有任何问题，我建议使用jQuery。

---

HTH

据我所知，您只想隐藏特定于浏览器的文件浏览控件，并提供您自己的样式按钮，同时选择并上载文件，例如，在文件浏览对话框关闭时上载照片。 在这种情况下，您需要这样的东西：

<form name="myForm" method="POST">
    <input type="file" name="image" id="image" 
        style="position: absolute; left: -1000px;"
        onchange="myForm.submit();" />
    <input type="button" name="upload" id="upload" value="upload"
        onclick="document.getElementById('image').click();" />
</form>

在Chrome中工作不会隐藏文件输入，而是将其移到页面外。如果其他浏览器有任何问题，我建议使用jQuery。

---

HTH

要在PHP中的$\u FILES数组中提供所选图像，需要为文件字段提供name属性，并将表单的enctype设置为multipart/form data，以便浏览器正确发布

<form action="some.php" method="post" enctype="multipart/form-data">
 <input type="file" id="image" name="image">
 <input type="button" value="select image" id="button">
</form>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

然后可以使用JavaScript打开选择对话框并提交表单

$('#button').click(function() {
  $('#image')[0].click();
});​​​​
$('#image').change(function() {
  $('form').submit();
});

​

---

这里假设您的页面上有jQuery，下面是一个工作示例

要在PHP中的$\u FILES数组中提供所选图像，您需要为文件字段指定一个name属性，并将表单的enctype设置为multipart/form data，以便浏览器正确发布

<form action="some.php" method="post" enctype="multipart/form-data">
 <input type="file" id="image" name="image">
 <input type="button" value="select image" id="button">
</form>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

然后可以使用JavaScript打开选择对话框并提交表单

$('#button').click(function() {
  $('#image')[0].click();
});​​​​
$('#image').change(function() {
  $('form').submit();
});

​

---

这里假设你的页面上有jQuery，这里有一个工作示例

，因为你没有发布任何代码，我们无法帮助你。用代码更新我的问题。你不想重定向页面吗？不。我正在尝试上传图像，如闪烁等。所以我想同时浏览和上传图像。我把我的PHP代码放在同一个文件中，用来上传和预览。如果我分开做，比如文件输入和提交，代码运行良好，但我想一步完成。因为你没有发布任何代码，我们无法帮助你。用代码更新了我的问题。你不想重定向页面吗？不。我正在尝试上传像flicker之类的图像。所以我想同时浏览和上传图像。我把我的PHP代码放在同一个文件中，用来上传和预览。如果我单独做（即文件输入和提交），代码工作得很好，但我想一步完成。enctype在几次场合让我抓狂！enctype已经在好几次场合抓住了我！