首页 > Web开发 > 详细

js操作H5页面获取表单项值

时间:2019-05-25 23:46:30      阅读:416      评论:0      收藏:0      [点我收藏+]

  最近在做H5相关功能页面用于手机app的使用,此功能类似于登记,有许多表单项填写,在H5中有button选择项不便使用form表单提交数据到后台接收,所以只能单独根据元素ID获取值。

 因为涉及到数十项相关表单项因此考虑有更简便的获取表单值方法,即遍历页面所有input元素、button元素进行值的获取代码如下:

  for(var ele of $.find(‘input‘)){

    alert(ele.value);

  } 

通过$.find(‘input‘) 获取到页面所有输入项元素数组,进一步想到通过muiajax向后提交数据正好用获取到的输入项元素数组赋值给data:{}

  var Formdata = {};

  

  for(var ele of $.find(‘.mui-btn.mui-btn-block‘)){
    Formdata[ele.name] = ele.innerText
  }

  

  mui.ajax(‘/abc/def/submit.action‘,{
  data:Formdata ,
  dataType:‘json‘,//服务器返回json格式数据
  type:‘post‘,//HTTP请求类型
  timeout:10000,//超时时间设置为10秒;

  success:function(data){
  mui.alert(‘success!‘);
  },
  error:function(xhr,type,errorThrown){
  //异常处理;
  mui.alert(xhr.response==""?type:mui.parseJSON(xhr.response).msg);
  console.log(xhr.response==""?type:mui.parseJSON(xhr.response).msg);
  }
  });
  }, false);

js操作H5页面获取表单项值

原文:https://www.cnblogs.com/luoning/p/10924369.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!