是否可以使用Bootstrap的modal dialog，jQuery，AJAX和PHP将图像上传到服务器？ 如果有，怎么样？ 如果没有什么原因呢？

我正在使用PHP，jQuery（jquery-1.9.1.min.js和jquery-ui-1.10.0.custom.min.js），AJAX，Bootstrap设计框架（Bootstrap v3.0.0）等。

我是网络编程领域的新手。

现在在一个地方，我想在点击按钮时显示Bootstrap框架的内置模式对话框 。 在此模式对话框中，将有一个用于上载图像文件的HTML文件控件。 用户将通过浏览文件从他/她的本地机器中选择任何图像文件。 然后执行以下所有必要的validation之后

• 适当的标准图像扩展
• 最大大小限制为5 MB
• 最小尺寸为940 px * 370 px

应使用PHP代码将文件上载到服务器。 如果任何validation失败，相关的错误消息应在文件上载HTML控件上方以红色显示。

是否可以实现此function？ 我听说使用AJAX上传文件是不可能的。 我真的不知道这是神话还是事实。 如果有人知道这件事，请详细向我解释。

Answer 1

是的，这是可能的。 这是让你入门的东西。

注意：这使用PHP类class.upload.php来上传图像。 （ http://www.verot.net/php_class_upload.htm ）

所有这些代码都经过测试和运行。 我只是把它掀起，所以它非常基本，但应该指向正确的方向。 您需要清理输入，执行正确的消息传递等。

只需创建一个文件（ index.html ）并将HTML和JavaScript复制/粘贴到其中。 然后创建一个文件post.php并将PHP放入其中。 下载class.upload.php脚本，然后创建名为uploads的目录。 为其提供适当的权限（0755或0777）。 将所有内容保存在此示例的同一文件夹中。 你应该好好去。

甚至可以将成功和错误消息放在模态中。 我只是为了简洁而在这里使用alert() 。 如果你想把消息放在模态中，只需在模态中创建一个

，给它一个ID，然后在我正在使用alert()的jQuery中定位该ID。 这很简单。

编辑：为示例添加了消息。 🙂

这是HTML和jQuery（ index.html ）

          
 Open Modal 
 
 
 
 
 ×Close 
Upload Photo
 
 
 
  
 
 Close Save 
 
 
 
 
 
      

和你的PHP脚本（ post.php ）

 allowed = 'image/*'; if($handle->uploaded) { $handle->Process('uploads'); if($handle->processed) { echo 'Image uploaded'; } else { echo 'error'; } }