向form中添加组件元素

困扰了我一下午，问题终于解决了....

问题描述：用的jQuery UI的对话框，在里面用到了上传文件这个<input type="file" name="uploadfile" id="file">，之前一直都是像绿色文本标注的那样，form中写个隐藏域，然后将对话框内的中的val传递过去，text传递到hidden中是没有问题的，但file传递给hidden老是出现问题，百思不得姐...

这是jQuery一个很特殊的地方，我的demandDialog明明是在form中的，可调用了jQuery方法后，在源码中看到的是紫色代码从form中剥离了出去，不知道为什么，反正紫色代码不在form中了，所以提交也没法传值。无耐只得用hidden继续传值...于是就遇到了上面的问题。

解：file不能传递到hidden中，可以调用jQuery的append方法，直接把想要追加的元素组件直接搞到form中去，就像这样：

var  input1 = $("#file");
$( "#responseForm" ).append(input1);

<form id="responseForm" action="addResponse" method="post" enctype="multipart/form-data">
				<!-- <input type="hidden" name="uploadfile" />  -->
				<span style="color:#33ff33;"><input type="hidden" name="content" />
				<input type="hidden" name="demand_id" /></span>
				<span style="color:#33ff33;"><input type="hidden" name="user_id" /></span>
					
				<span style="background-color: rgb(204, 51, 204);"><div style="display:none" id="demandDialog" title="您要提交的解决方案或文件">

					<ul class="ui-widget">
						<li>内容：</li>
						<li><textarea class="demand_textarea border_radius" name="contentInput"></textarea></li>
					</ul>
					 <input type="file" name="uploadfile" id="file">
					(可选)
				</div></span>
				<!-- <input type="submit"> -->
			</form>

$(function() {
			$("#demandDialog").dialog(
							{
								autoOpen : false,
								height : 500,
								width : 750,
								modal : true,
								buttons : {
									提交 : function() {
										<span style="color:#33ff33;">$("[name='content']").val($("[name='contentInput']").val());</span>
										/* <span style="color:#ff0000;">if($("[name='fileInput']").val()!=null||$("[name='fileInput']").val()!=""){
											$("[name='uploadfile']").val($("[name='fileInput']").val());
										}</span> */
										 var  input1 = $("#file");
									       <span style="background-color: rgb(0, 0, 0);"><span style="color:#ffffff;"> $( "#responseForm" ).append(input1);</span></span>
										<span style="color:#33ff33;">$("[name='user_id']").val(
												"${session.user.id}");</span>
										<span style="color:#33ff33;">$("[name='demand_id']").val(
												"${request.demand.id}");</span>
										$("#responseForm").submit();
										$(this).dialog("close");
									},
									取消 : function() {
										$(this).dialog("close");
									}
								},
								show : {
									effect : "slide",
									duration : 600
								},
								hide : {
									effect : "explode",
									duration : 700
								}

							});
			/* form = dialog.find( "form" ).on( "submit", function( event ) {
			      event.preventDefault();
			      addResponse();
			    }); */
			$("#button").click(function() {
				if ("${session.user}" == null || "${session.user}" == "") {
					alert("请先登录(⊙o⊙)哦");
					MyOpen('LoginFormDiv');
				} else {
					$("#demandDialog").dialog("open");
				}

			});
		});

方法解决得益于这篇博客：http://www.cnblogs.com/zwei1121/archive/2009/09/23/1572724.html

$(document).ready(function(){
    $("a.delete").click(function(event){
        action = this.getAttribute("action")
        form = $("<form></form>")
        form.attr('action',action)
        form.attr('method','post')
        input1 = $("<input type='hidden' name='input1' />")
        input1.attr('value','input1 value')
        input2 = $("<input type='text' name='textinput' value='text input' />")
        form.append(input1)
        form.append(input2)
        form.appendTo("body")
        form.css('display','none')
        form.submit()
    })
})