java文本和圖片怎么實現同時提交表單？

java文本和圖片怎么實現同時提交表單？相信大部分人都還沒學會這個技能，為了讓大家學會，給大家總結了以下內容，話不多說，一起往下看吧。

首先來看如下效果圖片：

表單代碼：

<form action="/addPro" method="post" enctype="multipart/form-data">
    <a>寵物（或產品）類型：</a><select id="categoryID" name="cid"></select><br/><br/>
    <a>寵物（或產品）名字：</a><input type="text" name="cname"><br/><br/>
    <a>一句話介紹：</a><input type="text" name="introduction"><br/><br/>
    <a>題目：</a><input type="text" name="title"><br/><br/>
    <a>價錢：</a><input type="text" name="price"><br/><br/>
    <a>庫存：</a><input type="text" name="stock"><br/><br/>
    <a>狀態：</a><select name="status">
        <option value="1">在售</option>
        <option value="2">下架</option>
        <option value="3">刪除</option>
    </select><br/><br/>
    <a>頭像設置:</a><input type="file" οnchange="previewFile()" name="fileName">
    <br/>
    <img src="${data.image}" alt="Image preview"/><br/>
    <a>詳細描述(編輯完需要在文本框右上角點保存)：</a><br/>
    <div id="editor">
        <p>商品詳細描述</p>
        <p>編輯完需要在文本框右上角點保存</p>
    </div><input type="hidden" name="details" id="detail"><br/><br/>
    <input type="submit" value="新增商品">
</form>

提交表單是采用二進制方式提交，所以一般用來上傳圖片操作，當在這個表單下同時上傳文本，就會報錯。但是業務需要上傳商品是文本和圖片同時上傳的，所以這里要用到commons的四個包，使用Maven導入，如下：

 <!-- https://mvnrepository.com/artifact/commons-io/commons-io有關圖片文本同時上傳 -->
    <dependency>
      <groupId>commons-io</groupId>
      <artifactId>commons-io</artifactId>
      <version>2.4</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload -->
    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>1.3.3</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/commons-collections/commons-collections -->
    <dependency>
      <groupId>commons-collections</groupId>
      <artifactId>commons-collections</artifactId>
      <version>3.1</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/commons-beanutils/commons-beanutils -->
    <dependency>
      <groupId>commons-beanutils</groupId>
      <artifactId>commons-beanutils</artifactId>
      <version>1.9.2</version>
    </dependency>

Java代碼如下：

主要判斷每一個參數的屬性，圖片的則進行圖片處理，文本則進行文本處理。

//新增產品
	@RequestMapping("/addPro")
	public void addPro(HttpServletRequest request, HttpServletResponse response) throws IOException {
		//編碼規范
		response.setContentType("text/html");
//		response.setCharacterEncoding("utf-8");
		Product product = new Product();
 
		//這種方法主要通過if (item.isFormField())這個條件判別文件還是非文件
		DiskFileItemFactory factory = new DiskFileItemFactory();
		ServletFileUpload upload = new ServletFileUpload(factory);
		List items = null;
		try {
			items = upload.parseRequest(request);
		} catch (FileUploadException e) {
			e.printStackTrace();
		} // 解析request請求
		Iterator iter = items.iterator();// 遍歷表單中提交過來的內容
		while (iter.hasNext()) {
			FileItem item = (FileItem) iter.next();
			if (item.isFormField()) { // 如果是表單域 ，就是非文件上傳元素
				String value = item.getString("UTF-8"); // 獲取value屬性的值，這里需要指明UTF-8格式，否則出現中文亂碼問題
				if (item.getFieldName().equals("cid")) {// 對應form中屬性的名字
					int categoryId = Integer.parseInt(value);
					product.setCategory_id(categoryId);
				} else if (item.getFieldName().equals("cname")) {
					product.setName(value);
				}else if (item.getFieldName().equals("introduction")) {
					product.setIntroduction(value);
				}else if (item.getFieldName().equals("title")) {
					product.setTitle(value);
				}else if (item.getFieldName().equals("price")) {
					BigDecimal price=new BigDecimal(value);
					product.setPrice(price);
				}else if (item.getFieldName().equals("stock")) {
					product.setStock(Integer.parseInt(value));
				}else if (item.getFieldName().equals("status")) {
					product.setStatus(Integer.parseInt(value));
				}else if (item.getFieldName().equals("details")) {
					product.setDetail(value);
				}
			}else {
				String filename = item.getName(); // 文件的名字
 
				String imgname = filename.substring(0, filename.indexOf("."));  //減去“.”后面的字符
 
				//tomcat啟動位置
//				String t1 = System.getProperty("user.dir").substring(0,
//						System.getProperty("user.dir").length() - 4);
 
				String path = request.getServletContext().getRealPath("img"); //target找到img位置
				Long time = Calendar.getInstance().getTimeInMillis();  //時間戳，保證文件命名不重復
				String imgurl = "./img/"+imgname+time+".jpg";
				product.setImage(imgurl);
				System.out.println(imgurl);
				File saveFile = new File(path+"/" + imgname+time+".jpg"); // 定義一個file指向一個具體的文件
				try {
					item.write(saveFile);// 把上傳的內容寫到一個文件中
					System.out.println("上傳到"+path+"成功");
				} catch (Exception e) {
					/* e.printStackTrace(); */
					System.out.println("文件"+path+"為空");
				}
			}
		}
 
		if(productDaoService.addProduct(product)){
			PrintWriter out = response.getWriter();
			out.print("<script language=\"javascript\">alert('ADD SUCCESS');window.location.href='/admin/administrator'</script>");
		}else {
			PrintWriter out = response.getWriter();
			out.print("<script language=\"javascript\">alert('增加失敗');window.location.href='/admin/addProduct'</script>");
		}
	}

看完上述內容，你們掌握java文本和圖片同時提交表單的方法了嗎？如果還想學到更多技能或想了解更多相關內容，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！