input/radio/select等标签的值获取和赋值,这几个是使用率最高的几个标签,获取值和赋值以及初始化自动填充数据和选择:

页面html:

          <div class=" ">
<label>统一社会信用代码</label> <input type="text" id="legalcreditcode"
name="legalcreditcode" placeholder="统一社会信用代码" />
</div> <div class=" ">
<label>项目法人类型</label> <select name="projectLegalType" id="projectLegalType"
              class="optionlist"></select>
          </div>

          <div class="">
              <label class="">是否重大项目</label>
<div style="float: left;">
<input type="radio" value="1" name="isMajorProject"
style="margin-left: 5px;" /><span
style="font-size: 14px; text-align: center; line-height: 30px; margin-left: 5px;">是</span>
</div>
<div style="margin-left: 30px; float: left;">
<input type="radio" value="0" name="isMajorProject"
checked="checked" style="" /><span
style="font-size: 14px; text-align: center; line-height: 30px; margin-left: 5px;">否</span>
</div>
          </div>

其中select下拉列表有涉及到mustache模板赋值所有的下拉选项;

几个标签值获取:

$(".submit").on("click", function() {

        // 获取页面填写得数据
var paras = {};
//function(index, $el)遍历元素设为变量$el
// jquery的封装方法,$.each遍历指定的标签取值,和paras[$el.id]方法,获取到所取的元素的id属性的值,el.value获取所取的元素的value值,
// 所取到的paras键值对的格式,键就是页面每个标签的id属性的值,后台也根据这个键名获取到对应的值

//对应含有class属性的标签下的input标签
     $.each($(".form-group input"), function(index, $el) {
paras[$el.id] = $el.value;
});
$.each($(".form-group2 input"), function(index, $el) {
paras[$el.id] = $el.value;
});
//对应含有class属性的标签下的textarea标签
$.each($(".form-group2 textarea"), function(index, $el) {
paras[$el.id] = $el.value;
});
//对应含有class属性的标签下的select标签
$.each($(".form-group select"), function(index, $el) {
paras[$el.id] = $el.value;
});
$.each($(".form-group2 select"), function(index, $el) {
paras[$el.id] = $el.value;
}); // radio类型的控件获取所选的值
paras["isMajorProject"] = $("input[name=isMajorProject]:checked").val();
     // 也可以数组慢慢手动赋值键值对,通过ajax请求交互传回到后台
var urlphaseGuid = Util.getUrlParams('phaseguid');
var urlbiguid = Util.getUrlParams('biguid');
paras["urlphaseGuid"] = urlphaseGuid;
paras["urlbiguid"] = urlbiguid;
if (!isEmpty(urlbiguid)) {
Util.ajax({
url : projectController.submitProject,
data : paras,
success : function(data) {
       //layer组件进行一些友好提示,提升用户体验
        layer.open({
type : 1,
skin : 'layui-layer-approve', // 样式类名
closeBtn : 0, // 不显示关闭按钮
anim : 2,
title : '',
shadeClose : false, // 开启遮罩关闭
area : [ '350px', '210px' ],
content : $("#submit-tmpl").html(),
success : function() {
$(".continue").on("click", function() {
window.location.href = rooturl + "/xxx/pages/xxx/projectdetail.html";
})
}
});
}
})
}
})

几个标签赋值或初始化自动填充:

// input标签赋值
$('#legalcreditcode').val(itemBaseinfo.itemlegalcerttype);
// select标签赋值同input标签赋值
$('#projectLegalType').val(itemBaseinfo.itemlegalcertnum);
// 是否重大项目radio赋值
$("input[name='isMajorProject'][value="+itemBaseinfoExtend.ismajorproject+"]").attr('checked',true);

最新文章

  1. oracle merge into用法
  2. POJ 1459:Power Network(最大流)
  3. OriDomi – 像折叠纸张一样折叠 DOM 元素
  4. 小白学Linux(四)--系统常用命令
  5. IIS7上设置MIME让其支持android和Iphone的更新下载
  6. combox绑定后添加自定义列
  7. CSS设置图片垂直居中的方法
  8. rsync命令(同步/备份数据)
  9. Google Web Designer 测试
  10. IOS开发环境更换后重新制作Provisioning Profile证书详解
  11. Uber司机一周体验记:成单率仅57%
  12. Android(Lollipop/5.0) Material Design(六) 自定义动画
  13. UML和模式应用学习笔记-1(面向对象分析和设计)
  14. Python基础学习8---list列表的操作
  15. VS中Release模式下生成去掉生成pdb文件
  16. (三)ajax请求不同源之jsonp跨域
  17. Redis的使用原理
  18. K/3 Cloud移动BOS开发技巧 -- K/3 Cloud多数据中心时如何支持发布到云之家.
  19. Unicode 是不是只有两个字节,为什么能表示超过 65536 个字符
  20. 理解、学习与使用 JAVA 中的 OPTIONAL&lt;转&gt;

热门文章

  1. iOS开发-数据存储NSCoder
  2. /etc/vim/vimrc的一个的配置
  3. [转]Android MediaPlayer状态机
  4. Python中常用包——sklearn主要模块和基本使用方法
  5. The end of the world
  6. JNUOJ 1184 - 科学计数法
  7. CCCC L2 部落 L3社交集群
  8. Cloudrea manager5安装CDH5文档
  9. Oracle备份恢复之热备份恢复及异机恢复
  10. 对爱奇艺PC Web主站来说,良好的SEO能够帮助其获得更多的搜索流量,因而页面上一些非常重要的内容仍然需要依靠服务端进行渲染,由于另外开发一套基于Node的SSR后台成本较高,而乐趣(基于java和velocity模板引擎)平台作为渲染系统已经十分成熟且运行稳定,在充分试验后,我们决定在Uniqy中使用服务端同步与客户端浏览器异步二次渲染相结合的方式,结合Vue2.0提供的 slot插槽机制,很