`
xyh
  • 浏览: 86092 次
  • 性别: Icon_minigender_1
  • 来自: China
社区版块
存档分类
最新评论

通过DOM创建的输入表单Submit为空

阅读更多

通过JavaScript DOM创建的表单input,不能随表单提交而提交,比如用下面脚本创建输入表单:

function handlevent(event){
 var count  = document.getElementById("answerint").value;
 count = parseInt(count);
 var eve = event||window.event;
 var theelement;
 for(var element = eve.srcElement||eve.target;element.tagName!="TR";element=element.parentElement){
   theelement = element.parentElement;
 }
 var tr = document.createElement("tr");
 var td = document.createElement("td");
 var label = document.createElement("label");
 label.appendChild(document.createTextNode("选项内容"));
 td.appendChild(label);
 tr.appendChild(td);
 var td = document.createElement("td");
 var divdiv = document.createElement("div");
 for(var i=1;i<=count;i++){
  var div = document.createElement("div");
  var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","contentstr");
  input.style.width="250px";
  div.appendChild(document.createTextNode("内容:"));
  div.appendChild(input);
  var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","score");
  input.style.width="20px";
  div.appendChild(document.createTextNode(";分值:"));
  div.appendChild(input);
  var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","score");
  input.style.width="350px";
  div.appendChild(document.createTextNode(";分析:"));
  div.appendChild(input);
  td.appendChild(div);
 }
 tr.appendChild(td);
 insertAfter(tr,theelement);
}

function insertAfter(newElement,targetElement) {
  var parent = targetElement.parentNode;
  if(parent.lastChild == targetElement) {
	 parent.appendChild(newElement);
  } else {
	 parent.insertBefore(newElement,targetElement.nextSibling);
  }
 }

 

 

在Form提交的时候,name为contentstr的值不能被反射到FormBean

 原因可能是防止脚本攻击,不允许随意添加表单提交的Form;

 

另外尝试了另外一种办法,work了:

通过javascript对表格操作的insertRow()、insertCell()来添加单元格,通过innerHTML来增加表单

 

另外尝试了一种通过创建DOM而获取表单值的方法,比如:

 var s=obj2.getElementsByTagName("input").length;
 var str="";
 for(var i=0;i<s;i++)
  {
     str+=obj2.getElementsByTagName("input").item(i).getAttribute("value")+"   " ; 
        } 
 alert(str);

 

 

 

 

 

分享到:
评论

相关推荐

    DOM基础教程之使用DOM控制表单

    在JavaScript中,你可以通过`form.action`属性来更改提交地址,或者使用`form.submit()`方法手动触发表单提交。在提交之前,可以通过遍历`elements`集合来获取和验证用户输入的数据。 8. 表单验证 DOM允许在客户端...

    js创建表单元素并使用submit进行提交

    首先,这段内容介绍了如何使用JavaScript动态创建表单元素,并通过submit方法将表单数据提交到服务器。以下将详细介绍相关知识点。 知识点一:使用JavaScript创建表单元素 在文档中,首先定义了一个函数...

    jquery用户输入表单验证.zip

    在这个例子中,`required`属性确保了邮箱字段不能为空,而`type="email"`则自动检查输入是否符合电子邮件的格式。 然而,HTML5的内置验证可能无法满足所有复杂需求,这时就需要用到jQuery进行更精细的控制。jQuery...

    jQuery验证表单属性是否为空

    在网页开发中,数据验证是确保用户输入符合预期的关键步骤,而jQuery库提供了一种方便的方式来实现这个功能。...通过深入理解jQuery的选择器、事件处理和DOM操作,你可以创建出更加健壮和灵活的表单验证机制。

    Jquery表单验证所有表单不能为空特效

    在"所有表单不能为空"的验证场景中,我们通常会在表单提交(`submit()`)时进行验证,或者在用户失去表单字段焦点(`blur()`)时即时反馈错误。 以下是一个简单的jQuery表单验证示例: ```javascript $(document)....

    jquery实现通过按钮弹出表单

    `$("#popupForm").submit()`则用于处理表单提交,`event.preventDefault()`阻止了表单的默认提交行为,这样我们就可以自定义数据处理逻辑,例如通过Ajax发送数据到服务器。 此外,如果你的表单包含更复杂的交互或...

    解决Layui 表单提交数据为空的问题

    通过上述检查和修改,基本可以解决大部分Layui表单提交数据为空的问题。如果问题依然存在,那么可能需要具体分析代码,查找其他可能的错误原因,例如浏览器的控制台报错信息、JavaScript代码的逻辑错误等。 总之,...

    jquery用户输入表单验证.rar_fsv_jquery用户输入表单验证_nodxf

    在网页开发中,表单验证是一项至关重要的任务...通过学习和实践,开发者可以创建出强大且用户友好的表单验证机制。在实际应用中,还可以结合现代前端框架(如React或Vue)和服务器端验证,构建更加完善的验证解决方案。

    bootstarp表单验证

    Bootstrap表单验证是一种在网页开发中确保用户输入数据有效性的技术。Bootstrap,作为最流行的前端框架之一,提供了优雅的样式和组件,使开发者...通过熟练掌握这些技巧,可以创建出既美观又功能强大的表单验证系统。

    在IE的模式窗口中,通过表单提交到本页,并通过javascript获取提交的参数

    标题 "在IE的模式窗口中,通过表单提交到本页,并通过javascript获取提交的参数" 描述了一种常见的Web开发技术应用场景。在Internet Explorer(IE)浏览器的特定模式下,用户通过表单填写信息并提交后,这些数据通常...

    用js创建form表单并提交.pdf

    表单通常包含输入字段(如`&lt;input&gt;`、`&lt;textarea&gt;`等),这些元素可以通过JavaScript动态创建并添加到表单中。例如,创建一个文本输入框: ```javascript var input = document.createElement('input'); input....

    Angular中Dom操作 以及表单( input、checkbox、radio、select、 textarea )结合双休数据绑定实现在线预约功能

    首先,Angular通过其强大的模板驱动和响应式表单机制,使得DOM操作变得简洁而高效。它提供了`@ViewChild`和`Renderer2`等工具,允许开发者安全地在组件和DOM之间交互,避免了直接操作DOM带来的问题,如性能下降和...

    JavaScript动态创建form表单并提交的实现方法

    但是,开发者需要注意到,动态创建的表单元素如果没有正确处理,可能会引起DOM结构混乱,或者在表单提交后无法正确处理服务器响应。因此,开发者需要根据实际情况,合理地控制表单的生命周期,确保用户界面的稳定性...

    javascript弹出层表单提交代码

    这可以通过监听表单的`submit`事件,然后在事件处理函数中执行验证逻辑来实现。例如,可以检查必填字段是否为空,邮箱格式是否正确等。 6. **异步提交**:为了保持页面的交互性,表单数据通常通过AJAX...

    JS判断form内所有表单是否为空的简单实例

    在上面给出的代码中,使用了一个简单的函数`checkForm`来检查表单内的每个输入元素(INPUT)是否为空。该函数通过遍历所有 INPUT 元素,并检查每个元素的`value`属性是否为空字符串""或null值。如果输入值为空,函数...

    jquery动态添加表单

    总结起来,jQuery动态添加表单涉及的主要知识点包括:引入jQuery库、创建和操作DOM元素、绑定事件处理程序以及处理表单提交。这些技术在现代Web开发中是不可或缺的,尤其是对于需要动态交互和实时更新的网页应用。

    基于jQuery和layui的form表单自定义js动态生成

    layui的表单组件支持多种表单元素和验证规则,可以方便地创建和定制表单样式。 三、动态生成表单 1. 引入依赖:首先,在HTML文件中引入jQuery和layui的CDN链接,确保它们在页面加载时可用。 ```html ...

    jquery表单验证实例,对数字,字数,必填项等校验

    6. **表单提交事件处理**:当验证通过后,可以监听`submit`事件来处理表单提交。使用`.submit(function(event) {...})`,在事件处理函数中进行服务器端验证或者数据提交。 7. **数字验证**:对于数字类型的验证,`...

    jQuery用户注册表单验证代码

    总之,jQuery提供了强大的工具来简化表单验证的实现,通过结合DOM操作、事件处理和正则表达式,我们可以创建出功能完善、用户体验良好的用户注册表单。这个小项目可以帮助你深入理解这些概念,并实践在实际项目中。

    基于elementui的数据驱动表单组件

    1. **基础用法**:在Element UI中,`el-form`是表单容器,通过`model`属性绑定到Vue实例的data对象,表单内的所有输入元素如`el-input`、`el-select`等通过`prop`属性与model中的属性进行绑定。例如: ```html ...

Global site tag (gtag.js) - Google Analytics