jQuery ajax请求返回list数据动态生成input标签,并把list数据赋值到input标签


Posted in Javascript onMarch 29, 2016

废话不多说了,直接给大家贴代码了,具体内容如下所示:

// js

<script type="text/javascript">
function myBtn_f() {
var cnt = $('#myCnt').val();
syncAjax('myAjax.html', {
'cnt' : cnt
}, function(result) {
if (100 == result.statusCode) {
var data = result.lst;
var $d = $('#myDiv');
alert("[" + data + "]");
for ( var i = 0; i < data.length; i++) {
var input1 = $("<input type='text' name='input1' />");
input1.attr('value', data[i]);
$d.append(input1);
}
} else {
alert("error");
}
});
}
function syncAjax(myUrl, myData, sufn) {
$.ajax({
url : myUrl,
data : myData,
type : 'post',
dataType : 'json',
cache : false,
async : false,
success : function(result) {
if (result.statusCode == 200) {
alert("会话超时,请重新登录!");
window.location.href = "index.jsp";
} else {
if (sufn)
sufn(result);
}
},
error : function(msg) {
alert("error:" + msg);
}
});
};
</script>

//html

<tr>
<td><input type="text" id="myCnt" /></td>
<td><div id="myDiv"></div></td>
</tr>
<input id="myBtn" type="button" value="create" onclick="myBtn_f()" />

// 后台

@RequestMapping("myAjax")
@ResponseBody
public String myAjax(
@RequestParam(defaultValue = "0", required = false) int cnt) {
List<String> lst = new ArrayList<String>();
for (int i = 0; i < cnt; i++) {
lst.add("no:" + i);
}
JSONObject result = new JSONObject();
result.put("statusCode", 100);
result.put("lst", lst);
return result.toString();
}

关于jQuery ajax请求返回list数据动态生成input标签,并把list数据赋值到input标签的全部介绍到此结束,希望对大家有所帮助!

Javascript 相关文章推荐
jQuery ul标签下拉菜单演示代码
Dec 11 Javascript
jquery tab插件精简版分享
Sep 10 Javascript
jquery Moblie入门—hello world的示例代码学习
Jan 08 Javascript
简单时间提示DEMO从0开始一直进行计时
Nov 19 Javascript
javascript跨浏览器的属性判断方法
Mar 16 Javascript
javascript版的in_array函数(判断数组中是否存在特定值)
May 09 Javascript
javascript匀速动画和缓冲动画详解
Oct 20 Javascript
基于bootstrap的选择框插件icheck
Dec 23 Javascript
js模态对话框使用方法详解
Feb 16 Javascript
JQuery实现图片轮播效果
May 08 jQuery
微信小程序实现基于三元运算验证手机号/姓名功能示例
Jan 19 Javascript
微信小程序登录态和检验注册过没的app.js写法
May 22 Javascript
JavaScript面向对象程序设计教程
Mar 29 #Javascript
jQuery实现图片加载完成后改变图片大小的方法
Mar 29 #Javascript
Web前端开发工具——bower依赖包管理工具
Mar 29 #Javascript
Jquery操作cookie记住用户名
Mar 29 #Javascript
jQuery简单实现提交数据出现loading进度条的方法
Mar 29 #Javascript
Javascript设计模式之观察者模式(推荐)
Mar 29 #Javascript
AngularJS directive返回对象属性详解
Mar 28 #Javascript
You might like
海河写的 Discuz论坛帖子调用js的php代码
2007/08/23 PHP
php垃圾代码优化操作代码
2010/08/05 PHP
php生成gif动画的方法
2015/11/05 PHP
PHP preg_match实现正则表达式匹配功能【输出是否匹配及匹配值】
2017/07/19 PHP
类似CSDN图片切换效果脚本
2009/09/17 Javascript
js实现的切换面板实例代码
2013/06/17 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
2014/08/15 Javascript
Javascript基础教程之数组 array
2015/01/18 Javascript
禁止弹窗中蒙层底部页面跟随滚动的几种方法
2017/12/07 Javascript
AngularJS实现动态切换样式的方法分析
2018/06/26 Javascript
js中的闭包实例展示
2018/11/01 Javascript
JavaScript 复制对象与Object.assign方法无法实现深复制
2018/11/02 Javascript
Vue路由模块化配置的完整步骤
2019/08/14 Javascript
Javascript实现简易天数计算器
2020/05/18 Javascript
vue cli4.0项目引入typescript的方法
2020/07/17 Javascript
[01:54]TI4西雅图DOTA2选手欢迎晚宴 现场报道
2014/07/08 DOTA
[00:52]DOTA2第二届亚洲邀请赛预选赛宣传片
2017/01/13 DOTA
[01:10:24]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第一场 2月28日
2021/03/11 DOTA
用Python的SimPy库简化复杂的编程模型的介绍
2015/04/13 Python
在Python的gevent框架下执行异步的Solr查询的教程
2015/04/16 Python
Python算法之图的遍历
2017/11/16 Python
django与小程序实现登录验证功能的示例代码
2019/02/19 Python
python模拟实现斗地主发牌
2020/01/07 Python
python下载的库包存放路径
2020/07/27 Python
Python之京东商品秒杀的实现示例
2021/01/06 Python
css3media响应式布局实例
2016/07/08 HTML / CSS
创建索引时需要注意的事项
2013/05/13 面试题
介绍一下SQL Server的全文索引
2013/08/15 面试题
5个HTML5的常用本地存储方式详解与介绍
2021/03/27 HTML / CSS
优秀学生获奖感言
2014/02/15 职场文书
听课评语大全
2014/04/30 职场文书
关于孝道的演讲稿
2014/05/21 职场文书
社区党支部承诺书
2015/04/29 职场文书
2015年惩防体系建设工作总结
2015/05/22 职场文书
Python基础之字符串格式化详解
2021/04/21 Python
Spring中的@Transactional的工作原理
2022/06/05 Java/Android