JS及相关控件
1、radio
1)不选中任何值
2)获取选中的值
3)让某个选项选中
4)发生改变时的事件
5)让某个选项不能选
2、CheckBox
1)选中 2)取消
3、select
1)获取下拉框选中项的显示字
4、ul li
1)点击选中改变样式
2)删除所有选中的li
3)遍历li
4)遍历li,获取li的文本
5、JS与样式
1)添加样式
2)删除样式
3)判断是否有某个样式
4)tab改变样式 6、设置不可编辑
7、div滚动到最底部
8、replace All
1、radio
<div id="phoneSign">
<input type="radio" name="sign" id="dfVal" value="0" />
<input type="radio" name="sign" value="1" />
<input type="radio" name="sign" value="2" />
</div> 1、不选中任何值:$("#phoneSign").val(""); 2、获取选中的值:$("#phoneSign input:checked").val();
或 :$("input[name='sign']:checked").val(); 3、让某个选项选中:$("#dfVal").attr("checked",true); 4、发生改变时的事件:
$(function (){
$('input[type=radio][name=impType]').change(function() {
if (this.value == 'ImportHouse') {
$("#addOpr").attr("checked",true);
document.getElementById("overOpr").disabled = true;
document.getElementById("noOpr").disabled = true;
} else {
document.getElementById("overOpr").disabled = false;
document.getElementById("noOpr").disabled = false;
}
});
}); 5、让某个选项不能选 : document.getElementById("noOpr").disabled = true;
2、CheckBox
1、选中: $("#usable").attr("checked",true);
2、取消: $("#usable").attr("checked",false);
3、select
1.获取下拉框选中项的显示字:
var filterType = $("#filterType option:selected").text();
4、ul li
(注:selected 是样式的名称className) 1.点击选中改变样式
$(function(){ $("#test li").click(function() { // 为id为test的ul绑定每个选项的点击事件 $(this).siblings('li').removeClass('selected'); // 删除其他兄弟元素的样式 $(this).addClass('selected'); // 添加当前元素的样式
}); }); 2.删除所有选中的li.
$("#test .selected").remove(); 3.遍历li.
$("#test li").each(function(){
$(this).removeClass('selected');
}); 4.遍历li,获取li的文本
$("#test li").each(function(){
alert($(this).text());
});
5、JS与样式
1.添加样式:$("#test").addClass("aaa");
2.删除样式:$("#test").siblings('li').removeClass('aaa');
3.判断是否有某个样式:$("#test").hasClass('aaa');
4.tab改变样式
function showtab(btnid,tabid,tabnumber)
{
for (i = 1;i<=tabnumber;i++)
{
document.getElementById(tabid+"_btn"+i).className = "";
document.getElementById(tabid+"_sub"+i).style.display = "none";
}
document.getElementById(tabid+"_btn"+btnid).className = "selected";
document.getElementById(tabid+"_sub"+btnid).style.display = "block";
}
6、设置不可编辑
按钮:
document.getElementById("savebtn").disabled = true; input:
$("input[type='text']").attr("disabled",true);
7、div滚动到最底部
var div = document.getElementById('flowDiv');
div.scrollTop = div.scrollHeight;
8、replace All
html = html.replace(/BSS/g,"CBSS");
JS及相关控件的更多相关文章
- 百度地图API示例之添加定位相关控件
代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...
- JS数量输入控件
JS数量输入控件 很早看到kissy首页 有数量输入控件,就随便看了下功能 感觉也不怎么难 所以也就试着自己也做了一个, 当然基本的功能和他们的一样,只是用了自己的编码思想来解决这么一个问题.特此给大 ...
- 用js给html控件赋值
用js给html控件赋值 <script> window.onload=function setValue()//在页面加载时赋值 { document.getElementById( ...
- Android开发工程师文集-相关控件的讲解,五大布局
前言 大家好,给大家带来Android开发工程师文集-相关控件的讲解,五大布局的概述,希望你们喜欢 TextView控件 TextView控件有哪些属性: android:id->控件的id a ...
- 2.23 js处理日历控件(修改readonly属性)
2.23 js处理日历控件(修改readonly属性) 前言 日历控件是web网站上经常会遇到的一个场景,有些输入框是可以直接输入日期的,有些不能,以我们经常抢票的12306网站为例,详细讲解如 ...
- ADF控件ID变化引发JS无法定位控件的解决方法
原文地址:ADF控件ID变化引发JS无法定位控件的解决方法作者:Nicholas JSFF定义的控件ID到了客户端时往往会改变.例如在JSFF中的一个的ID为"ot1",但是当这个 ...
- vs2010开发activex(MFC)控件/ie插件(三),js调用ocx控件的接口函数
原文:http://blog.csdn.net/yhhyhhyhhyhh/article/details/50802280 js调用ocx控件的接口函数,先看demo效果: 简单测试过程 ...
- 利用来JS控制页面控件显示和隐藏有两种方法
利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 document.getEle ...
- JS给html控件赋值
<html> <head> <title> JS给html控件赋值 </title> <script language="javascr ...
随机推荐
- RedHat Enterprise Linux 6.4使用网易Centos 6 的yum源
1.首先到http://mirrors.163.com/centos下载软件包 x86 地址:http://mirrors.163.com/centos/6/os/i386/Packages/ x86 ...
- com.mysql.jdbc.connection和java.sql.connection的区别
com.mysql.jdbc.Connection 是mysql自己的接口 针对于对mysql的出来,java.sql.Connection 这是一个公共的接口包括对mysql的支持oracle,sq ...
- python 小试一题
a = 66count = 1while count <=3 : b = int(input("猜测这个数字:")) if b < a: print("猜测的 ...
- StringBuufer与StringBulder线程的区别
StringBulder的append方法 不是synchronized修饰的 线程不安全 效率相对很快StringBuufer的append方法 是 synchronized修饰的 ...
- 【QT】qt python install pip
https://pip.pypa.io/en/stable/installing/ http://www.runoob.com/w3cnote/python-pip-install-usage.htm ...
- 安全相关及HttpClient
1,Spring Security入门示例 Spring Security Annotation Configuration Example – HelloWorld 2,程序模块Get请求,获取响应 ...
- Visual Studio 的插件及常用快捷键_ 系统Ubuntu16.04
安装在 Ubuntu 的系统上 1, 常用的快捷键 [1] 调出终端: Ctrl + `(反引号); [2] 调出插件安装界面: Ctrl + P (打开插件面板) ---> 输入 ext i ...
- 60.Vue:将px转化为rem,适配移动端
1.下载lib-flexible 我使用的是vue-cli+webpack,所以是通过npm来安装的 npm i lib-flexible --save 2.引入lib-flexible 在main. ...
- 【论文速读】Cong_Yao_CVPR2017_EAST_An_Efficient_and_Accurate_Scene_Text_Detector
Cong_Yao_CVPR2017_EAST_An_Efficient_and_Accurate_Scene_Text_Detector 作者和代码 非官方版tensorflow实现 非官方版kera ...
- WPF中查找指定类型的父控件
/// <summary> /// 查找父控件 /// </summary> /// <typeparam name="T"></type ...