龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

jQuery选择器全集详解(7)

时间:2014-11-28 03:01来源:网络整理 作者:网络 点击:
分享到:
script type="text/javascript" $(document).ready(function() { alert($(':selected').val()); });/script select option value="外企"外企/option option value="国企"国企/option option value="私企"私

SNAGHTML14414ae

<script type="text/javascript">
    $(document).ready(function() {
        alert($(':selected').val());
    });</script>
<select>
    <option value="外企">外企</option>
    <option value="国企">国企</option>
    <option value="私企">私企</option>
</select>

四、表单选择器

1. :input(取input,textarea,select,button元素)

:input元素这里就不再多说了,前面的一些例子中也已经囊括了。

2. :text(取单行文本框元素)和:password(取密码框元素)

这两个选择器分别和属性选择器$('input[type=text]')、$('input[type=password]')等同。

image

<script type="text/javascript">
   $(document).ready(function() {
        $(':text').css('border', '1px solid #FF0000');
        $(':password').css('border', '1px solid #0000FF');
        // 等效代码
        //$('input[type=text]').css('border', '1px solid #FF0000');
        //$('input[type=password]').css('border', '1px solid #0000FF');
   });</script>
<fieldset style="width: 300px;">
    <legend>账户登录</legend>
     <div>
        <label>用户名:</label><input type="text"/>
    </div>
    <div>
        <label>密  码:</label><input type="password"/>
    </div>
</fieldset>

3. :radio(取单选框元素)

:radio选择器和属性选择器$('input[type=radio]')等同

<script type="text/javascript">
    $(document).ready(function() {
        $(':radio').each(function() {
            alert($(this).val());
        });
        // 等效代码
        /*
        $('input[type=radio]').each(function() {
            alert($(this).val());
        });
        */
    });</script>你现在工作的企业属于:
    <input type="radio" name="radio" checked="checked" value="外企"/>外企
    <input type="radio" name="radio" value="国企"/>国企
    <input type="radio" name="radio" value="民企"/>民企

4. :checkbox(取复选框元素)

:checkbox选择器和属性选择器$('input[type=checkbox]')等同

<script type="text/javascript">
    $(document).ready(function() {
        $(':checkbox').each(function() {
            alert($(this).val());
        });
        // 等效代码
        /*
        $('input[type=checkbox]').each(function() {
            alert($(this).val());
        });
        */
    });</script>
    您的兴趣爱好:
    <input type="checkbox" />游泳
    <input type="checkbox" />看书
    <input type="checkbox" checked="checked" value="打篮球"/>打篮球
    <input type="checkbox" checked="checked" value="电脑游戏"/>电脑游戏
精彩图集

赞助商链接