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 相关文章推荐
如何实现浏览器上的右键菜单
Jul 10 Javascript
JavaScript实现url地址自动检测并添加URL链接示例代码
Nov 12 Javascript
windows8.1+iis8.5下安装node.js开发环境
Dec 12 Javascript
javascript上下方向键控制表格行选中并高亮显示的方法
Feb 13 Javascript
jquery图片切换实例分析
Apr 15 Javascript
jquery带下拉菜单和焦点图代码分享
Aug 24 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
Sep 17 Javascript
JavaScript装饰器函数(Decorator)实例详解
Mar 30 Javascript
JS实现简单的抽奖转盘效果示例
Feb 16 Javascript
JavaScript从原型到原型链深入理解
Jun 03 Javascript
详解如何提升JSON.stringify()的性能
Jun 12 Javascript
JavaScript实现九宫格拖拽效果
Jun 28 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
法兰绒滤网冲泡
2021/03/03 冲泡冲煮
在Windows版的PHP中使用ADO
2006/10/09 PHP
php 仿Comsenz安装效果代码打包提供下载
2010/05/09 PHP
PHP mcrypt可逆加密算法分析
2011/07/19 PHP
php操作mysqli(示例代码)
2013/10/28 PHP
PHP中使用smarty生成静态文件的例子
2014/04/24 PHP
php smarty truncate UTF8乱码问题解决办法
2014/06/13 PHP
phpmyadmin提示The mbstring extension is missing的解决方法
2014/12/17 PHP
php利用事务处理转账问题
2015/04/22 PHP
php基本函数汇总
2015/07/09 PHP
PHP二维数组矩形转置实例
2016/07/20 PHP
php自定义函数br2nl实现将html中br换行符转换为文本输入中换行符的方法【与函数nl2br功能相反】
2017/02/17 PHP
网站繁简切换的JS遇到页面卡死的解决方法
2014/03/12 Javascript
使用focus方法让光标默认停留在INPUT框
2014/07/29 Javascript
分享28款免费实用的 JQuery 图片和内容滑块插件
2014/12/15 Javascript
JavaScript中的console.assert()函数介绍
2014/12/29 Javascript
jQuery选择器源码解读(六):Sizzle选择器匹配逻辑分析
2015/03/31 Javascript
多功能jQuery树插件zTree实现权限列表简单实例
2016/07/12 Javascript
JS 动态加载js文件和css文件 同步/异步的两种简单方式
2016/09/23 Javascript
JS实现根据密码长度显示安全条功能
2017/03/08 Javascript
vue 基于element-ui 分页组件封装的实例代码
2018/12/10 Javascript
javascript面向对象三大特征之继承实例详解
2019/07/24 Javascript
基于better-scroll 实现歌词联动功能的代码
2020/05/07 Javascript
JavaScript设计模式之策略模式实现原理详解
2020/05/29 Javascript
15行Python代码实现网易云热门歌单实例教程
2019/03/10 Python
Django之无名分组和有名分组的实现
2019/04/16 Python
Django框架之DRF 基于mixins来封装的视图详解
2019/07/23 Python
python高阶函数map()和reduce()实例解析
2020/03/16 Python
python 使用tkinter+you-get实现视频下载器
2020/11/17 Python
python3中for循环踩过的坑记录
2020/12/14 Python
墨西哥购物网站:Elektra
2020/01/21 全球购物
编写一个类体现构造,公有,私有方法,静态,私有变量
2013/08/10 面试题
致裁判员加油稿
2014/02/08 职场文书
2015年乡镇妇联工作总结
2015/05/19 职场文书
小兵张嘎观后感300字
2015/06/03 职场文书
CSS文本阴影 text-shadow 悬停效果详解
2022/05/25 HTML / CSS