原生JS实现选中的radio变为未选中

需求如下,radio已经选中,再点击,取消选中状态. 效果如链接:演示地址直接上代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <input type="radio" name="sex" id="sex1&…

（转）jquery serialize表单序列化，当radio或checkbox 未选中时，没有序列化到对象中的原因分析和解决方案 - ghostsf

相信很多人都用过jq的表单序列化serialize()方法,因为这能很方便地帮你把表单里所有的非禁用输入控件序列化为 key/value 对象,不需要你再去一个个地拼接参数了. 这是一个很好用的函数,用过的你肯定知道.但是ghostsf最近发现一个小bug(也许不应该叫bug,姑且称之).就是当radio或checkbox 未选中时,没有序列化到对象中. 什么原因呢?下面分析之:瞄一眼源码:From jQuery JavaScript Library v2.1.4 jQuery.fn.exten…

Jquery Mobile下设置radio控件选中

问题: .html文件头部引入了: <script src="js/jquery.js"></script> <script src="js/jquery.mobile-1.3.2.min.js"></script> 使用jquery.mobile下radio控件: <input type="radio" name="radio-choice" id="radio…

JS----checked----checked选中和未选中的获取

, allValue.length - 1); allValue = allValue.replace(/[ ]/g, ""); var checkedIds = allValue.split("|"); console.log(checkedIds); $.postJSON('/docAssociate', checkedIds, function(res){ $('#btnSave').button('reset'); location.href = '/tes…

在js中取选中的radio值

在js中取选中的radio值 <input type="radio" name="address" value="0" /> <input type="radio" name="address" value="1" /> <input type="radio" name="address" value="2&…

jquery 设置checked="checked"无效，radio未选中。。

jquery 设置checked="checked"无效,radio未选中.. 最好还是使用.prop(),在jQuery1.6版本之前.attr存在一些bug.在1.6之后它会自动把.attr()转换成.prop().…

折腾一天，获取下列多选框的所有选中值，原生js可直接通过obj.val()来获取，可jq不行，要通过循环取值来获取;

折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;…

JS 如何获取radio或者checkbox选中后的值

废话不多说,直接上代码: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>JS 如何获取radio或者checkbox选中后的值</title> </head> &l…

原生js实现选中所有的checkbox

<div class="con"> <input name='多选项名称' type='checkbox' value='' id="all" onclick="cli('cc');"> 全选 <input name='cc' type='checkbox' value='' > A <input name='cc' type='checkbox' value='' > B <input na…

checked="checked"无效，radio未选中问题排查

在使用attr给元素设置属性的时候,但是显示在页面就是未选中,而且是只使用一两次是ok的,但是连着多使用就不起作用了,百度了下,发现遇到这个问题的人还蛮多的, 有人说,发现在jQuery1.6版本之后,用prop 替换了attr,替换了测试了下,果然OK,但是详细查询了下资料,发现这种说法并不准确下面的用法就知道怎么用了: 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. 参考这篇文章:https://…

原生JS实现购物车结算功能代码+zepto版

html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Con…

【js】操作checkbox radio 的操作总结

摘要总是忘记checkbox radio 的具体操作,总是坑自己,总结下记下来 html <input type="checkbox" value="1" name="ckTest" id="ckTest1">1</input> <input type="checkbox" value="2" name="ckTest" id=&quo…

原生js实现类的添加和删除,以及对数据的add和update、view ，ajax请求，页面离开的操作

1 类操作 function hasClass(cla, element) { if(element.className.trim().length === 0) return false; var allClass = element.className.trim().split(" "); return allClass.indexOf(cla) > -1; } function addClass(cla,element){ if(!hasClass(cla,element)…

原生JS实现省市区（县）三级联动选择

原文地址→看过来写在前面前段时间写一个关于天气的东西,里面的省市区(县)城市选择让我很头疼,在网上搜索出来大都是借助插件或者第三方库,感觉这样做代码会很重,所以索性就把几种城市选择的方式实现一遍,以备日后的不时之需.这三种方法都是针对pc端的,并且都是使用原生js实现的,连jq都没使用,于是代码有点繁琐额(尴尬)....不过还是让我把原理讲完吧. 源代码地址→传送门预览地址→传送门方法一:下拉选择框实现省市区(县)三级联动用下拉框实现省市区三级联动是很常见的一种方式,也很方便.这里需要…

原生javascript自定义input[type=radio]效果

2018年6月27日更新找到最为简单的仅仅使用css3的方案 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> input[type="radio"]+label::be…

原生js替换jQuery各种方法-中文版

原文https://github.com/nefe/You-D... 原生JS与jQuery操作DOM对比 You Don't Need jQuery 前端发展很快,现代浏览器原生 API 已经足够好用.我们并不需要为了操作 DOM.Event 等再学习一下 jQuery 的 API.同时由于 React.Angular.Vue 等框架的流行,直接操作 DOM 不再是好的模式,jQuery 使用场景大大减少.本项目总结了大部分 jQuery API 替代的方法,暂时只支持 IE10 以上浏览器.…

ToDoList(原生JS)了解一下

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ToDoList—最简单的待办事项列表</title> <link rel="shortcut icon" href="../img/panda.ico"> <link rel="style…

通过案例来剖析JQuery与原生JS

首先来个例子: 我们在登陆或者注册一些网站时,如果某一项点过了但没填,鼠标移走后是不是经常看到网站有相应的红色字体提示呢? 那下面我们就以这个为例来剖析下jQuery和原生JS的一些区别,来上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src=…

原生JS封装Ajax插件(同域&&jsonp跨域)

抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正确的地方,还望指正^_^ 一.Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一款引入XHR对象的浏览器,而IE5中的XHR对象是通过MSXML库中的一个ActiveX对象实现的,因此在IE中可能有3个版本,即MSXML2.XMLHttp.…

原生js实现Ajax

一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataType: '', data: { }, success: function(){ }, error: function(){ } }) 原生js实现Ajax方法: var Ajax={ get: function (url,fn){ var obj=new XMLHttpRequest(); //…

原生JS 表单提交验证器

转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定不用外部流行的框架,如bootstrap,由于我负责的模块仅仅是其中的一部分,因此少数服从多数,无奈只能抛弃bootstrap等提供的布局,样式以及验证等一些列如此方便的组件,(他们拒绝使用的原因也令人发省). 那么问题就来了. 二.设计理念我们都知道,在抛开外部框架,仅仅用JS+css+html 去开…

原生js与jquery操作iframe

1 原生js获取iframe的window对象 //方法1 document.getElementById('iframeId').contentWindow; //方法2 window.frames['iframeName'] 2 原生js iframe与父窗口操作 2.1 父窗口操作IFRAME:window.frames["iframeId"].document 2.2 IFRAME操作父窗口: window.parent.documen 3 jquery…

原生js发送ajax请求

堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不管结果怎样,一定要完成这次任务——毕竟是花了银子的,不能浪费.所以准备写一个系列博客,把开发过程中遇到的各种小问题记录下来,也算是从头到尾做一个开发备案吧.通读了开发要求,大致做了一下分解,打算拆分成一个个的小模块,逐个击破.今天是准备阶段,想先试着调一下接口,看看能否调的通. 言归正传.从页面向服…

用原生JS读写CSS样式的方法总结

为了日后方便查询,本人翻阅了一些资料总结了以下方法,仅限原生JS,如有不对的地方欢迎指出!只求大家看完觉得有学到点什么就OK了! 一.可以通过DOM节点对象的style对象(即CSSStyleDeclaration对象)来读写文档元素的CSS样式如:var elm = document.getElementById('test'); elm.style.color = 'black'; 二.通过Element对象的g…

原生js动画效果（源码解析）

在做页面中,多数情况下都会遇到页面上做动画效果,大部分都是用jquery来实现动画,今天正好看到一篇原生js实现动画效果的代码,特分享在此. 原文地址:http://www.it165.net/pro/html/201410/23513.html 1.匀速动画效果说明:匀速动画就是动画的效果从开始到结束每次执行的速度都是一致的 <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR…

原生js dom记忆的内容

1.DOM基础getElementByIdgetElementByTagNamegetElementByName getElementsByClass querySelector querySelectorAllgetAttributesetAttributeremoveAttribute domobj.tagNamedomobj.innerHTML innerHTML与innerText的区别.http://akunamotata.iteye.com/blog/440863domobj.idd…

AJAX请求和跨域请求详解（原生JS、Jquery）

一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. 本博客实验环境: python: web框架:tonado jquery:2.1.1 二.“伪”AJAX 由于HTML标签…