2

我正在构建一种内部通信工具，用户可以在其中发表评论和附加文件。

我正在使用蓝色 imp 文件上传器：https ://github.com/blueimp/jQuery-File-Upload/

我在这里做了一个jsfiddle：http: //jsfiddle.net/denislexic/s56xG/12/

但为了简化，我在这里做了一个摘录：

<form action="/path/to/submit/" method="post" style="padding:10px;">
    <textarea style="display:block; width:60%;"></textarea>


    <form id="fileupload" action="server/php/" method="POST" enctype="multipart/form-data">
        <!-- Blue imp form stuff in here -->
    </form>


    <a href="#" class="btn JS_fileUpload">Attach file</a>
    <button type="submit" class="btn btn-primary">Post</button>
</form>

问题是，设计明智，我真的需要提交按钮在文本区域和文件上传器之后，文件上传器必须在两者之间......所以这意味着我必须有嵌套表单（这不会不工作）？还有其他解决方案吗？

PS：我看过这个问题，但似乎不相关：提交位于另一个表单中的表单

提前感谢您的帮助。

4

2 回答 2

3

一种简单的方法是不使用<form>，而是使用另一个元素，例如 a div：

<div id="fileupload">

您需要更新脚本并设置url参数：

    $('#fileupload').fileupload({
        url: 'http://www.example.com/uploadFile.php',

希望这可以帮助。

于 2013-07-03T10:00:39.660 回答
1

您可以使用 CSS 将内容移动到适当的位置，同时保持有效的 HTML：

<style type="text/css">
#container {
  position: relative;
}
#content0 {
  position: absolute;
  top: 0;
  left: 0;
}
#content1 {
  position: absolute;
  top: 3ex;
  left: 0;
  border: 1px solid blue;
  padding: 5px;
}
#sub0 {
  position: absolute;
  top: 8ex;
  left: 0;
}
</style>

<div id="container">

<form>
  <div id="content0">
    <input name="foo">
    <input id="sub0" type="submit"> 
  </div>
</form>

<form>
  <div id="content1">
    <input name="bar">
    <input type="submit" value="Submit this bit"> 
  </div>
</form>

</div>
于 2012-08-10T02:47:07.890 回答