61,112
社区成员
发帖
与我相关
我的任务
分享请发表友善的回复…
发表回复
happy小王八 2018-09-10
- 打赏
- 举报
了解，谢谢！
Logerlink 2018-09-08
- 打赏
- 举报
加一个就往数组存一个标识（或者一个对象{id:1,value:'first'}）,删除的话再通过标识来移除数组里面的元素，最后面直接将数组传进后台
程序员徐金 2018-09-07
- 打赏
- 举报
你后面button是根据你第二个 input type = text 是否为空而判断是否显示 button 你第二个inputtext如果有值 button就不会消失 ，不消失 给button添加点击事件。点击事件 发送ajax请求 发送到后台页面 可以是get请求 直接url后台地址后？key=value&...拼接字符串发送
happy小王八 2018-09-07
- 打赏
- 举报
效果可以实现，但是还有一个问题需要请教一下，就是，我最后如何把写入的值传给后端服务器？期间如果有button被删除了怎么处理？
葉幺 2018-09-07
- 打赏
- 举报
聚焦时改成input输入框 失焦时判断有是否为空，为空的时候则变成添加视频btn 不为空追加input
風灬雲 2018-09-07
- 打赏
- 举报
加上了删除按钮，样式随意写的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin:0;
padding:0;
}
.box{
margin:30px;
}
.input{
display:inline-block;
}
</style>
</head>
<body>
<div class="box">
<div class="input"></div>
<button class="btn"> + 按钮</button>
</div>
<script src="./js/jquery@2.2.4.js"></script>
<script>
$(function(){
$(".btn").on("click",function(){
let Input=$("<input />");
Input.css({
width:"50px",
height:"10px",
margin:"10px"
});
Input.on("blur",function(){
if(this.value){
let Span=$("<span></span>"),I=$("<i>x</i>");
Span.css({
padding:"0 5px",
background:"#EEF",
color:"#DD8",
margin:"5px",
border:"1px solid #D5F"
})
I.css({
padding:"0 5px",
color:"#ccc",
cursor:"pointer",
fontStyle:"normal"
})
I.on("click",function(){
$(this).parent().remove();
});
Span.text(this.value);
Span.append(I);
$(".input").append(Span)
}
$(this).remove()
$(".btn").show()
});
$(".input").append(Input);
Input.focus()
$(".btn").hide()
})
})
</script>
</body>
</html>
風灬雲 2018-09-07
- 打赏
- 举报
input框的获取焦点和失去焦点事件，点击按钮的时候按钮消失，添加一个input框并使input框获得焦点，当input框失去焦点时，按钮重新出现
代码如下
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin:0;
padding:0;
}
.input{
display:inline-block;
}
</style>
</head>
<body>
<div>
<div class="input"></div>
<button class="btn"> + 按钮</button>
</div>
<script src="./js/jquery@2.2.4.js"></script>
<script>
$(function(){
$(".btn").on("click",function(){
let Input=$("<input />");
Input.css({
width:"50px",
height:"10px",
margin:"10px"
})
Input.on("blur",function(){
if(!this.value){
$(this).remove()
}
$(".btn").show()
});
$(".input").append(Input);
Input.focus()
$(".btn").hide()
})
})
</script>
</body>
</html>
