jquery+bootstrap做一个开关(互斥选择)

知识点:js中的return 不能使js程序停止或者跳出执行,会继续往下执行。要想让js程序停止或者跳出 可以用 return false 就可以了。

代码:

<!---------------------------------------------html---------------------------------------------------------------------------------->

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>html3</title>
<meta name="description" content="">
<meta name="author" content="Administrator">
<style type="text/css">
.btn {
background-color: #337ab7;
}
.masthead {
background-color: darken(#428bca, 6.5%);
}
</style>
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<script type="text/javascript" src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>
<script type="text/javascript">
$(function() {
$("#btn2").click(function() {
var v = $(this).text().trim();
if (‘Middle‘ == v) {
$(this).text(‘des‘).siblings().addClass(‘disabled‘);
} else {
$(this).text(‘Middle‘).siblings().removeClass(‘disabled‘);
}
});

$(‘#btn1‘).click(function() {
var v = $(‘#btn2‘).text().trim();
if (‘des‘ == v)
return false;
alert(111);
});
$(‘#btn3‘).click(function() {
var v = $(‘#btn2‘).text().trim();
if (‘des‘ == v)
return false;
alert(222);
});
});
</script>
</head>
<body>
<div>
<header>
<h1>html3</h1>
</header>
<div class="btn-group" role="group">
<button type="button" id="btn1" class="btn btn-default masthead">
Left
</button>
<button type="button" id="btn2" class="btn btn-default">
Middle
</button>
<button type="button" id="btn3" class="btn btn-default">
Right
</button>
</div>
</div>
</body>
</html>

<!---------------------------------------------html---------------------------------------------------------------------------------->

时间: 2024-12-14 08:09:31

jquery+bootstrap做一个开关(互斥选择)的相关文章

.Net MVC&amp;&amp;datatables.js&amp;&amp;bootstrap做一个界面的CRUD有多简单

我们在项目开发中,做得最多的可能就是CRUD,那么我们如何在ASP.NET MVC中来做CRUD呢?如果说只是单纯实现功能,那自然是再简单不过了,可是我们要考虑如何来做得比较好维护比较好扩展,如何做得比较漂亮.做开发要有工匠精神,不要只求完成开发任务,那样的话,永远停留在只是简单的写业务逻辑代码水平,我们要做有追求的程序员.本来这么简单的东西,我真是懒得写,但是看到即便是一些工作了好些年的人,做东西也是只管实现功能,啥都不管,还有些界面css样式要么就硬编要么就毫无规则的在页面中进行穿插,遇到要

.net,mvc使用bootstrap做一个标准后台

今天准备搭一个公用后台,使用bootstrap,方便今后开发,顺便mark一下 后期列表页将使用kendo-ui,增强后台的效果 下面是代码... login页面 1 @{ 2 Layout = null; 3 } 4 5 <!DOCTYPE html> 6 7 <html lang="zh-cn"> 8 <head> 9 <meta charset="utf-8"> 10 <meta http-equiv=&q

Vue指令实战:结合bootstrap做一个用户信息输入表格

结合前面的vue指令做了个小例子,用户在表单里面输入用户名和年龄,点击"添加"以后会保存到用户信息表里面 <!DOCTYPE html> <html> <head lang="en">     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-

[心情琐记]-为什么我选择做一个程序员?【谨以此文献给初入技术之路的纯白少年】

前言:此文又臭又长,废话连篇.某段言论激进,但绝无偏见.兄弟伙伴们看过且一笑置之. 人总是会变得,人也是最善变的动物.而我们要坚定的去努力不变成曾经厌恶的人! 那些年我们书生意气,伴着朗朗的读书声.'"大江东去浪淘尽,千古风流人物...","...惜秦皇汉武,略输文采,唐宗宋祖,稍逊风骚...",仿佛自己便是那些指点江山,激昂文字的主人公了,那些年我们是一群天真烂漫的纯白少年. 此去经年,应是良辰好景虚设,便纵有千种风情更与何人说?每当临近了六月,空气中弥漫的都是这

jquery实现多选框只能选择一个

jquery代码如下: 1 $(":checkbox").bind("click",function(){ 2 $(":checkbox").removeAttr("checked");//取消全选 3 $(this).attr("checked","checked");//选择一个 4 }); jquery实现多选框只能选择一个

我是怎么4个小时从0做一个网站的

万事皆有因 近期公司的事情我基本上不太能插上手写代码(当领导了,天天写邮件和整理Excel),但是做为一个前主程怎么忍心让自己的技能荒废了呢(其实已经自废武功:Ruby on Rails完全忘的差不多了)?再和小伙伴们做一个项目A的时候,偶然间想起了我手里还有个域名ailink.io还是挺上口的(鬼知道我当时怎么想的要买这域名),再加上自己对Lisp大法的一些情怀(Emacs用多了的后遗症,早几年发现intelliJ,大概我和Lisp就没啥关系了).然后就开始作为项目A的子功能先行开发完成了,并

如何做一个富文本编辑器

很久以前就想做一个富文本编辑器,但是感觉比较难,一直没有实现.直到了解了html5的contenteditable属性可以设置一个div为可编辑状态,利用这个特性做富文本编辑器就比较简单了 首先 认识一下 contenteditable 它是一个属性 可以这样使一个DIV的编辑状态被激活 <div contenteditable="true"></div> 然后这个div就可以被编辑了 而我们要想获得它的html源码可以使用innerHTML来取得 举个例子如下

jQuery插件开发精品教程(让你的jQuery更上一个台阶)

刘哇勇的部落格要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈. 学会使用jQuery并不难,因为它简单易学,并且相信你接触jQuery后肯定也使用或熟悉了不少其插件.如果要将能力上升一个台阶,编写一个属于自己的插件是个不错的选择. 本教程可能不是最精品的,但一定是最细致的. jQuery插件开发模式 软件开发过程中是需要一定的设计模式来指导开发

一个无锁消息队列引发的血案:怎样做一个真正的程序员?(二)——月:自旋锁

前续 一个无锁消息队列引发的血案:怎样做一个真正的程序员?(一)——地:起因 一个无锁消息队列引发的血案:怎样做一个真正的程序员?(二)——月:自旋锁 平行时空 在复制好上面那一行我就先停下来了,算是先占了个位置,虽然我知道大概要怎么写,不过感觉还是很乱. 我突然想到,既然那么纠结,那么混乱,那么不知所措,我们不如换个视角.记得高中时看过的为数不多的长篇小说<穆斯林的葬礼>,作者是:霍达(女),故事描写了两个发生在不同时代.有着不同的内容却又交错扭结的爱情悲剧,一个是“玉”的故事,一个是“月”