Jquery操作radio的简单实例_jquery

<input name="study" type="radio" value="Jquery插件教程">Jquery插件教程
<input name="study" type="radio" value="Jquery学习">Jquery学习
<input name="study" type="radio" value="PHP学习">PHP学习
<input id="tijiao" type="button" value="确定">
<input id="set_jqeury_study" title="Jquery学习" type="button" value="将radio设定为Jquery学习">
<input name="study" type="text" value="请输入您想学到的知识">
<input id="view_input_text" type="button" value="点击我,查看到的是同样名为‘study',但是类型是TEXT的输入框里面的值">

在上面的html代码中,细心的您应该可以发现3个radio的name属性和一个text的name属性都是“study”

复制代码 代码如下:

$(function(){
$('#tijiao').click(function(){
if ($("input:[name=study]:radio:checked").length == 0){
alert("请选择您想学习的知识");
return false;
}
var study = $("input:[name=study]:radio:checked").val();
alert("谢谢!您选择的是" + study);
})
$("#set_jqeury_study").click(function(){
var $button = $(this);
$("input:[name=study]:radio").each(function(){
if (this.value == $button.attr('title')){
this.checked=true;
}
})
})
$("#view_input_text").click(function(){
alert($("input[name=study]:text").val());
})
})

$(“input:[name=study]:radio:checked”)这段代码取得的是所有name属性为“study”而且已经被选中的radio的jquery对象,通过判断他的length 是否等于0,就可以知道这个radio选项是否有一个被选中了。$(“input[name=study]:text”)这段代码取得的是name属性为“study”的text输入框的jquery对象。

时间: 2024-08-24 08:36:58

Jquery操作radio的简单实例_jquery的相关文章

Jquery操作radio的简单实例

 本篇文章主要介绍了Jquery操作radio的简单实例.需要的朋友可以过来参考下,希望对大家有所帮助 <input name="study" type="radio" value="Jquery插件教程">Jquery插件教程 <input name="study" type="radio" value="Jquery学习">Jquery学习 <input

jquery自适应布局的简单实例_jquery

代码整理 - uix.layout.js /** * Grace [jQuery.js] * * UIX页面布局 * 290353142@qq.com * exp: * $.uix.layout();//执行布局 * class="uix-layout-container";//标识布局容器 * class="uix_box";//用于调整 布局时将此元素高度铺满父容器(支持设置padding\margin\border) * 例: html1:div中 <d

jQuery中:radio选择器用法实例_jquery

本文实例讲述了jQuery中:radio选择器用法.分享给大家供大家参考.具体分析如下: 此选择器能够选取所有单选按钮. 语法结构: 复制代码 代码如下: $(":radio") 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="htt

jquery淡入淡出效果简单实例_jquery

本文实例讲述了jquery淡入淡出效果实现方法.分享给大家供大家参考,具体如下: 之前理解有一些误区,以为淡入淡出是删除该元素,其实只是把该元素隐藏起来 和 显示出来罢了. 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xml

jQuery 无限级菜单的简单实例_jquery

我将CSS完全分离出来用jQuery附加式样,就是为了多级染色,并且生成目录树和控制式样也很容易,生成时也不需要考虑式样.数据表建议用事先Order排序的方式,不要读取数据的时候才分级排序,这样性能会较佳. 我把它做成了个.Net的控件,作为轻量级的无限目录树,还是相当好用的.只是还不完善,我先慢慢修改,等差不多了再发布出来. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu

JavaScript操作选择对象的简单实例_javascript技巧

JavaScript操作选择对象的简单实例 //替换选中文本内容,参数text为要替换的内容 function SetSelectionText(text) { //非IE浏览器 if (window.getSelection) { var sel = window.getSelection(); alert(sel.rangeCount); //选区个数, 通常为 1 . sel.deleteFromDocument(); //清除选择的内容 var r = sel.getRangeAt(0)

DOM操作和jQuery实现选项移动操作的简单实例_jquery

DOM: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DOM选项移动操作</title> <style> select { width: 100px; height: 85px; } div { display: inline-block; width: 50px } </style

jQuery简单操作cookie的插件实例_jquery

本文实例讲述了jQuery操作cookie的插件.分享给大家供大家参考,具体如下: jQuery.cookie = function(name, value, options) { if (typeof value != 'undefined') { // name and value given, set cookie options = options || {}; if (value === null) { value = ''; options.expires = -1; } var e

jquery.serialize() 函数语法及简单实例_jquery

jQuery - serialize() 方法 W3School给出的定义与用法: serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身. 序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中. 语法 $(selector).serialize()详细说明 .serialize() 方法创建以标准 URL 编码表示的文本字符串.它的操作对象是代表表单元素集合的 jQuer