jquery( 点击按钮出来文本框并限制文本框的个数)
// 首先呢 编辑这个文章 主要是用于和大家的交流 以便学习和交流!!
<div class="form-group" id="spots">
<label>选项</label>
<input type="button" class="form-control" id="add" value="添加选项"/>
<span><font color="#a9a9a9" size="2px">一个选择最多只可添加5个单选项!</font></span>
</div>
</pre><p>//接下来 我们就用使用jquery的代码来操作一下的部分</p><p><pre name="code" class="javascript"><script type="text/javascript">
$(document).ready(function(){
var spotMax = 5;
if($('div.spot').size() >= spotMax) {$(obj).hide();}
$("input#add").click(function(){addSpot(this, spotMax);
});
}); function addSpot(obj, sm) {
$('div#spots').append(
'<div class="spot">'+
'<br><input type="text" name="spot_title[]" /> '+
'<input type="button" class="remove btn btn-xs btn-danger" value="Delete" /></div>')
.find("input.remove").click(function(){
$(this).parent().remove();
$('input#add').show();
}); if($('div.spot').size() >= sm){$(obj).hide();}
};
</script>
//这样我们就可以简单的完成一个关于Jquery的点击按钮出来文本框的操作了!
此外千万不要忘记引用Jquery.js的文件噢 !
jquery( 点击按钮出来文本框并限制文本框的个数)的更多相关文章
- jquery点击按钮复制内容
做移动端的项目遇到一个需求要点击按钮复制dom里的内容,看了很多资料显示必须textarea或者input里的内容才能简单复制,还有就是用插件的了,最终都因为遇到各种问题放弃,最终选择了最简单的点击复 ...
- jquery点击按钮弹出图片
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- jQuery 点击按钮刷新页面
//页面加载时绑定按钮点击事件 $(function () { $("#按钮id").click(function () { refresh(); }); }); //点击按钮调用 ...
- jquery 点击按钮实现listbox的显示与隐藏,点击其他地方按钮外的地方,隐藏listbox
本来不知道如何获取服务器的控件的,这下知道可以这么做了,所以记录下来.... <asp:ImageButton ID="alltime" ImageUrl="ima ...
- jquery点击按钮或链接,第一次与第二次执行不同的事件
本文和大家分享一个jquery的实例,这个实例实现的是点击网页里的按钮或链接,第一次和第二次会执行不同的事件,也就是两个事件会轮流执行. <script language="javas ...
- jQuery点击弹出层,弹出模态框,点击模态框消失
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...
- Jquery 点击按钮将其背景图换成另一张,再次点击恢复默认图片
这是Jquery代码: $(function () { $("#h1").toggle(function () { $("#h1").css("bac ...
- jQuery点击按钮实现div的隐藏和显示切换效果
<script type="text/javascript"> $(function(){ $('#click_event').click(function(){ i ...
- jquery点击按钮显示和隐藏DIv
function changeDisplay() { if ($("#btnShow").attr("value")== "添加附件") { ...
随机推荐
- Leetcode102. Binary Tree Level Order Traversal二叉树的层次遍历
给定一个二叉树,返回其按层次遍历的节点值. (即逐层地,从左到右访问所有节点). 例如: 给定二叉树: [3,9,20,null,null,15,7], 3 / \ 9 20 / \ 15 7 返回其 ...
- Python 原生2种 邮件发送(发送验证码) 的方法
import smtplib from email.mime.text import MIMEText # 第三方 SMTP 服务 mail_host = "smtp.sina.cn&quo ...
- HDU 4584
//也是简单题,因为n太小,故暴力之! #include<stdio.h> #include<math.h> #include<string.h> #define ...
- Activity、FragmentActivity和AppCompatActivity的区别
Activity Activity是最基础的一个,是其它类的直接或间接父类. Activity中只能使用系统自带的host Fragment(API Level 11中加入),对应getFragmen ...
- spring boot resttemplate发送post,get请求
参考博客: https://blog.csdn.net/weixin_42456466/article/details/80728387 https://www.cnblogs.com/QQParad ...
- Centos无法连接无线网络解决办法
系统->管理->服务器设置->服务,将NetworkManager选项勾选,点击重启服务.然后就可以看到右上角已经有了网络连接.
- javascript控件开发之滚动条控件
首先,基于行前几篇开发的的框架,我们在目录 component\ui\下添加文件 com.ui.scrollBar.js, 在文件中定义com.ui.scrollBar类,继承com.ui.windo ...
- PhpStorm中如何配置SVN,详细操作方法 - 郑加全的博客 - CSDN博客
登录|注册 郑加全的博客 目录视图 摘要视图 订阅 CSDN日报0711——<离开校园,入职阿里,开启新的程序人生> 征文 | 你会为 AI 转型么? ...
- 洛谷 1083 (NOIp2012) 借教室——标记永久化线段树 / 差分+二分
题目:https://www.luogu.org/problemnew/show/P1083 听说线段树不标记永久化会T一个点. 注意mn记录的是本层以下.带上标记的min! #include< ...
- PyCharm使用之配置SSH Interpreter
在文章PyCharm使用之利用Docker镜像搭建Python开发环境中,该文章介绍了在PyCharm中如何利用Docker镜像搭建Python开发环境.在本文中,将会介绍如何使用PyCharm来 ...