<div id="app">
<ul>
<li v-for="(item, index) in username">
${index}. <input type="text" :name="'sb['+index+']'" /> <a href="javascript:;" :index="index" @click="del">delete</a>
</li>
</ul>
<a href="javascript:;" @click="add">add</a>
</div>
var app = new Vue({
el: '#app',
delimiters : ['${', '}'],
data: {
username : [1, 2, 3] // 只要数组的下标,因此数值无所谓
},
methods : {
// 添加选项
add : function(){
this.username.push(1);
},
// 删除当前选项
del : function(e){
var index = e.target.getAttribute('index'); // 获取所在位置然后删除
this.username.splice(index, 1);
}
}
})
<div id="app">
<ul>
<li v-for="(item, index) in username">
${index}. <input type="text" :name="'sb['+index+']'" :value="item" > <a href="javascript:;" :index="index" @click="del">delete</a>
</li>
</ul>
<a href="javascript:;" @click="add">add</a>
</div>
var app = new Vue({
el: '#app',
delimiters : ['${', '}'],
data: {
username : ['wenzi', 'xxxx', 'yyyy'] // 只要数组的下标,因此数值无所谓
},
methods : {
// 添加选项
add : function(){
this.username.push(''); // 新添加的输入框为空
},
// 删除当前选项
del : function(e){
var index = e.target.getAttribute('index'); // 获取所在位置然后删除
this.username.splice(index, 1);
}
}
})
// 上传图片,绑定change事件
uppic : function(e){
var file = e.target.files[0]; // 每次只允许上传一张图片,因此只取[0]
// 判断图片格式
if( file.type!='image/png' ){
alert('图片格式不正确');
e.target.files.length = 0;
$(e.target).val('');
return false;
}
// 使用formData组装数据
var formData = new FormData();
formData.append('pic', $(e.target)[0].files[0]); // 文件数据
formData.append('flag', '1'); // 其他的一些参数
$.ajax({// ajax上传
url: 'xxxxx.php',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(result) {
console.log('上传完成');
});
}
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有