checkbox：click事件触发span元素内容改变
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>checkbox</title>
<script src="jquery.js"></script>
</head>
<body>
<p>我想去<span id="spanId">_____</span></p>
<form action="#" id="form">
<input type="checkbox" name="city" value="南京">南京
<input type="checkbox" name="city" value="北京">北京
<input type="checkbox" name="city" value="纽约">纽约
</form>
<script>
$(function () {
$("input[name=city]").click(function () {
var arr = [];
$("input[name=city]").each(function () {
if(this.checked){
arr.push(this.value);
}else{
var index = arr.indexOf(this.value);
if(index != -1){
arr[index] = "";
}
}
});
$("#spanId").text(arr.join(","));
})
});
</script>
</body>
</html>
checkbox：click事件触发span元素内容改变的更多相关文章
- vue实现动态绑定class--（三目运算符）根据span数字内容改变其样式
一.根据span数字内容改变数字本身样式(两种样式) <template> //使用三目运算符,判断当span的val是否小于0给其不同的class名 <span class=&qu ...
- div、span绑定内容改变事件
内容改变事件onchange只适用于form表单标签(input.select.textarea) 当需要对div.span标签进行内容改变监听则无法适用,查阅了一些资料发现jquery有针对的方法, ...
- 关于IOS浏览器：document,body的click事件触发规则
今天做了个手机页面,点击某个按钮->弹出菜单,再点击菜单以外的任意位置->关闭菜单,在其他浏览器里面没有问题,但是在IOS浏览器中并不会关闭. 网上解决这个bug的帖子很多,这篇帖子主要是 ...
- click事件触发也有失灵的时候？
今天做了个手机页面,点击某个按钮->弹出菜单,再点击菜单以外的任意位置->关闭菜单,在其他浏览器里面没有问题,但是在IOS浏览器中并不会关闭. 网上解决这个bug的帖子很多,这篇帖子主要是 ...
- checkbox：click事件触发文本框显示隐藏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue click事件获取当前元素属性
Vue可以传递$event对象 <body id="app"> <ul> <li @click="say('hello!', $event) ...
- selenium常用命令之操作页面元素及获取元素内容的事件整理
/**id <input type="text" id="phone" name="phone" class="LoginT ...
- 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存在影响
原文地址 背景 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当a标签内部存在嵌套时, 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存 ...
- a标签嵌套href默认行为与子元素click事件存在影响
2018-08-07 Question about work 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当<a>标签内部存在嵌套时, 父元素&l ...
随机推荐
- POJ2195 Going Home —— 最大权匹配 or 最小费用最大流
题目链接:https://vjudge.net/problem/POJ-2195 Going Home Time Limit: 1000MS Memory Limit: 65536K Total ...
- JS截取与分割字符串常用技巧总结
本文实例讲述了JS截取与分割字符串的常用方法.分享给大家供大家参考,具体如下: JS截取字符串可使用 substring()或者slice() 函数:substring() 定义:substring( ...
- Laravel 5 微信小程序扩展
小程序官方的加解密 SDK 已经非常清楚了,只不过改成 Laravel 风格而已,仅仅相当于搬砖工.至于重复造轮子,我发现其他人的扩展解密用户信息的时候代码出错了,并且需要安装一个 Laravel 的 ...
- 【iOS】KVC 和 KVO 的使用场景
http://blog.csdn.net/chenglibin1988/article/details/38259865 Key Value Coding Key Value Coding是coc ...
- JavaScript-Tool：jquery.jsprint.js
ylbtech-JavaScript-Tool:jquery.jsprint.js 一个通过单击页面按钮,便实现页面打印的jQuery插件jqprint. 1.返回顶部 1. 插件描述:一个通过单击页 ...
- 修改CentOS系统的默认启动级别
======修改CentOS系统的默认启动级别====== 现在的Linux系统安装完后就运行在第5个级别,即系统启动后直接进入图形界面,而不用在字符模式下登录后用startx或者xinit来起动图形 ...
- teamviewer被识别为商业用途
1.卸载teamviewer,在控制面板里或者用360等软件卸载: 2.删除下面两个目录 C:\Program Files (x86)\TeamViewer C:\Users\Administrato ...
- mtr和nmap命令
mtr mtr是一个网络连通性判断工具,它可以结合ping nslookup tracert 来判断网络的相关特性. [root@10.10.90.97 ~]# mtr -h usage: mtr [ ...
- ubuntu scp命令或者用root连接ssh提示：Permission denied, please try again.错误
1.su - #!!! 2.vi /etc/ssh/sshd_config 3.PermitRootLogin yes # 找到此字段,改为此行所示 4./etc/init.d/ssh restart ...
- js 将json字符串转换为json对象的方法解析-转
例如: JSON字符串:var str1 = '{ "name": "cxh", "sex": "man" }'; JS ...