zoukankan      html  css  js  c++  java
  • JQuery从头学起第三讲

    作者:绝地苍狼

        看了前面两讲的54淘客网友,我想应该对JQuery已经有了个初步的认识,知道如何用JQuery选择器来获取控件的值,今天我们主要讲使用JQuery对常用控件的取值。 

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JQuery3.aspx.cs" Inherits="JQuery_1.JQuery3" %>

    <!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 runat="server">

    <title></title>

    <script type="text/javascript" src="JS/jquery-1.3.2.min.js"></script>

    <script type="text/javascript">

    function Get() {

    var v1
    = $("#txt1").val();//获取文本框输入的值

    var v11
    = $("#txt1").attr("value");//获取文本框输入的值,效果和上面方法一致

    var v2
    = $("#txt2").val();//文本框输入的密码的值

    var v3
    = $("input[name='ck']:checked").val();//获取checkbox勾上后的值,

    var v4
    = $("#h1").val();//获取隐藏控件的值

    var v5
    = $("input[name='rdo']:checked").val();//获取一组radio被选中的值

    var v6
    = $("#ss").val();//获取下来框选中的value

    var v7
    = $("select[name='s1'] option[value='" + v6 + "']").text();//选取下拉框选中的文本

    var v8
    = $("select[id='ss'] option[value='" + v6 + "']").text();//选取下拉框选中的文本,上面是通过name来获取,这里是通过ID来获取,但这里的ID不能加#

    alert(v1
    +","+v2+","+v3+","+v4+","+v5+","+v6+","+v8)

    }

    </script>

    </head>

    <body>

    <form id="form1" runat="server">

    <div>

    <input type="text" id="txt1" />

    <input type="password" id="txt2" />



    <input type="checkbox" id="ck1" name="ck" value="" />





    <input type="hidden" id="h1" value="www.54talk.cn" />



    www
    <input type="radio" id="r1" name="rdo" value="www" />

    54talk
    <input type="radio" id="r2" name="rdo" value="54talk" />

    cn
    <input type="radio" id="r3" name="rdo" value="cn" />



    <select name="s1" id="ss">

    <option value="0"></option>

    <option value="1"></option>

    </select>

    <input type="button" onclick="Get()" value="取值"/>

    </div>

    </form>

    </body>

    </html>

           以上DEMO中的代码是我一个个敲出来的,都经过测试,大家可以放心的使用。这个DEMO中主要加了对输入框的几种类型的取值,这也列举了取值的两种方式,DEMO中除了介绍了文本框的取值外还介绍了下拉框,单选框,多选框的取值,这里用到了复合属性选择器,需要同时满足多个条件时使用。不像文本框那么单纯,用个ID就可以获取到值。在获取select的value的时候也用个复合属性选择器就可以了,但是要获取下拉框的文本就要先得到value,再根据value去获取text。

           今天这一讲就讲这么多,下一讲我们讲用JQuery来对这些常用控件赋值,因为我们在做页面初始化的时候,常常需要对某些控件进行初始化。

  • 相关阅读:
    ES2017 新特性:Async Functions (异步函数)
    为什么 window.location.search 为空?
    vue-cli 构建Vue项目后的打包和发布
    Vue.js父子组件如何传值 通俗易懂
    vue 面试题(文章末尾还有其他链接)
    vue组件命名和传值 and 父子组件传值
    line-gradient 之渐变角度
    vue-router路由模式
    vue-router 去掉#
    记录vue项目上线遇到的一些问题
  • 原文地址:https://www.cnblogs.com/_fyz/p/jquery3.html
Copyright © 2011-2022 走看看