码迷,mamicode.com
首页 > Web开发 > 详细

常用JQuery示例

时间:2017-06-19 19:47:11      阅读:240      评论:0      收藏:0      [点我收藏+]

标签:val   car   javascrip   style   jquery   理解   undefined   click   ice   

1.单选按钮

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>js24.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="jquery/jquery-3.2.1.min.js"></script>
   <script type="text/javascript" src="test.js"></script>
</head>
<body>
<div>
    <input type="radio" name="sex" value="M" checked><br>
    <input type="radio" name="sex" value="F"><br>
</div>
<input type="button" value="click me" onclick="Invoice.test();">
</body>
</html>

test.js

;(function(window, document, undefined) {


var Invoice = {};
Invoice.test = function () {

    //定义一个对象接收页面传过来的属性
    var params = new Object();

    //取到的值不是男或女,而是M或F,我理解是value属性的值
    params.sex = $("input[name=‘sex‘]:checked").val();

    alert("性别:" + params.sex)
};


window.Invoice = Invoice;


})(window, document);

2.下拉列表

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>js24.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="test.js"></script>
</head>
<body>
<div>
    <select id="carType">
        <option value="Volvo">Volvo</option>
        <option value="Saab">Saab</option>
        <option value="Opel">Opel</option>
        <option value="Audi">Audi</option>
    </select>
</div>
<input type="button" value="click me" onclick="Invoice.test();">
</body>
</html>

test.js

;(function(window, document, undefined) {


var Invoice = {};
Invoice.test = function () {

    var params = new Object();

    params.status = $("#carType").val();

    alert("车型 : " + params.status)
};


window.Invoice = Invoice;


})(window, document);

 

常用JQuery示例

标签:val   car   javascrip   style   jquery   理解   undefined   click   ice   

原文地址:http://www.cnblogs.com/winner-0715/p/7050049.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!