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 相关文章推荐
Javascript判断文件是否存在(客户端/服务器端)
Sep 16 Javascript
JavaScript 模块化编程(笔记)
Apr 08 Javascript
JavaScript在form表单中使用button按钮实现submit提交方法
Jan 23 Javascript
在React中如何优雅的处理事件响应详解
Jul 24 Javascript
微信小程序授权获取用户详细信息openid的实例详解
Sep 20 Javascript
Angular中管道操作符(|)的使用方法
Dec 15 Javascript
Angular学习教程之RouterLink花式跳转
May 03 Javascript
JavaScript中七种流行的开源机器学习框架
Oct 11 Javascript
微信小程序MUI侧滑导航菜单示例(Popup弹出式,左侧滑动,右侧不动)
Jan 23 Javascript
如何基于layui的laytpl实现数据绑定的示例代码
Apr 10 Javascript
JavaScript检测是否开启了控制台(F12调试工具)
Oct 02 Javascript
使用Vant完成DatetimePicker 日期的选择器操作
Nov 12 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
239军机修复记
2021/03/02 无线电
浅谈laravel orm 中的一对多关系 hasMany
2019/10/21 PHP
动态样式类封装JS代码
2009/09/02 Javascript
基于JQuery的类似新浪微博展示信息效果的代码
2012/07/23 Javascript
js输出阴历、阳历、年份、月份、周示例代码
2014/01/29 Javascript
基于jQuery实现的文字按钮表单特效整理
2014/12/07 Javascript
JS模拟按钮点击功能的方法
2015/12/22 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
2016/09/01 Javascript
微信小程序  wx.request合法域名配置详解
2016/11/23 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
jquery对象与DOM对象转化
2017/02/08 Javascript
jquery radio 动态控制选中失效问题的解决方法
2018/02/28 jQuery
详解Node使用Puppeteer完成一次复杂的爬虫
2018/04/18 Javascript
在vue中使用Autoprefixed的方法
2018/07/27 Javascript
Vue.js 实现数据展示全部和收起功能
2018/09/05 Javascript
如何实现js拖拽效果及原理解析
2020/05/08 Javascript
python的三目运算符和not in运算符使用示例
2014/03/03 Python
Python随机生成信用卡卡号的实现方法
2015/05/14 Python
浅谈Django学习migrate和makemigrations的差别
2018/01/18 Python
Python使用MD5加密算法对字符串进行加密操作示例
2018/03/30 Python
使用anaconda的pip安装第三方python包的操作步骤
2018/06/11 Python
Python调用服务接口的实例
2019/01/03 Python
python中对数据进行各种排序的方法
2019/07/02 Python
python按行读取文件并找出其中指定字符串
2019/08/08 Python
python使用sessions模拟登录淘宝的方式
2019/08/16 Python
Django通过dwebsocket实现websocket的例子
2019/11/15 Python
Pytorch 实现冻结指定卷积层的参数
2020/01/06 Python
利用python查看数组中的所有元素是否相同
2021/01/08 Python
学前教育教师求职自荐信
2013/09/22 职场文书
小学运动会入场式解说词
2014/02/18 职场文书
2015初中团支部工作总结
2015/07/21 职场文书
小学班主任工作随笔
2015/08/15 职场文书
一个家长教育孩子的心得体会
2016/01/15 职场文书
社会心理学学习心得体会
2016/01/22 职场文书
大学生奖学金获奖感言(范文)
2019/08/15 职场文书
python Django框架快速入门教程(后台管理)
2021/07/21 Python