`
webcode
  • 浏览: 6078260 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

jQuery+PHP获取Select option 选择的Text和Value(附选择城市实例)

 
阅读更多


PHP代码:

                 <li>
                    <span class="l2">所在城市</span>
                    <select class="city">
                        <option  value="">选择所在城市</option>
                       <%foreach from=$supportcity item=city key=k%>
                        <option value="<%$k%>" <%if $nowcity==$city.city_name%>selected<%/if%> ><%$city.city_name%></option>
                        <%/foreach%>
                    </select>
                </li>
                <li>
                <span class="l2" id="area">所在地区</span>
                <%foreach from=$supportcity item=city key=k%>
                    <select class="area" citycode="<%$k%>" >
                        <option value="">选择所在地区</option>
                        <%foreach from=$city.areas item=area%>
                            <option value="<%$area.area%>"><%$area.area%></option>
                        <%/foreach%>
                    </select>
                <%/foreach%>
                </li>

Jquery代码:

        $("select.city").change(function(){
            var ccode = $(this).val();
            $("select.area").hide();
            if(ccode){
                $("select.area[citycode="+ccode+"]").show();
            }
        });
        var sltcity = $("select.city").val();
        if(sltcity){
             $("select.area[citycode="+sltcity+"]").show();
        }

下面是详细的:

jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置

获取一组radio被选中项的值:var item = $('input[name=items][checked]').val();
获取select被选中项的文本:var item = $("select[@name=items] option[@selected]").text();

获取select被选中项的文本 :var item = $("select[name=items] option[selected]").text(); 或$("select[name=items]").find("option:selected").text();

select下拉框的第二个元素为当前选中值:$('#select_id')[0].selectedIndex = 1;

select下拉框value = 'val'的元素为当前选中项:$("select[name=items] option[value='val']").attr("selected","selected");

radio单选组的第二个元素为当前选中项 :$('input[@name=items]').get(1).checked = true; 或$('input[name=items]').attr("checked", '1′);

radio的value = 'val'的元素为当前选中项:$('input[name=items] [value='val']').attr("checked","checked");


获取值:

文本框,文本区域:$("#txt").attr("value");

多选框checkbox:$("input[name='checkbox':checked]").each(function(){

var val = $(this).val();

});

单选组radio: $("input[type=radio][checked]").val();

下拉框select的value值: $('select').val();

下拉框select选中的text 值:$("select").find("option:selected").text();

控制表单元素:

文本框,文本区域:$("#txt").attr("value","); //清空内容

$("#txt").attr("value",'11′); //填充内容

多选框checkbox:
checkbox的第二个元素被打勾:$("input[name=items]").get(1).checked = true; //打勾
$("input[name=items]").get(1).checked = false; //不打勾

checkbox的value='val'的元素前打勾:$("input[name=item][value='val']").attr("checked",true); 或$("input[name=item][value='val']").attr("checked","checked");

if($("input[name=item][value='val']").attr('checked')==true) //判断是否已经打勾

单选组radio: $("input[type=radio]").attr("checked",'2′);//设置value=2的项目为当前选中项

下拉框select: $("#sel").attr("value",'-sel3′);//设置value=-sel3的项目为当前选中项

$("<option value='1′>1111</option><option value='2′>2222</option>").appendTo("#sel")//添加下拉框的option

$("#sel").empty();//清空下拉框

jQuery获取Radio选择的Value值


代码

$("input[name='radio_name'][checked]").val(); //选择被选中Radio的Value值
$("#text_id").focus(function(){//code...}); //事件 当对象text_id获取焦点时触发
$("#text_id").blur(function(){//code...}); //事件 当对象text_id失去焦点时触发
$("#text_id").select(); //使文本框的Vlaue值成选中状态
$("input[name='radio_name'][value='要选中Radio的Value值'").
attr("checked",true); //根据Value值设置Radio为选中状态

jQuery获取CheckBox选择的Value值

$("input[name='checkbox_name'][checked]"); //选择被选中CheckBox元素的集合 如果你想得到Value值你需要遍历这个集合
$($("input[name='checkbox_name'][checked]")).
each(function(){arrChk+=this.value + ',';});//遍历被选中CheckBox元素的集合 得到Value值
$("#checkbox_id").attr("checked"); //获取一个CheckBox的状态(有没有被选中,返回true/false)
$("#checkbox_id").attr("checked",true); //设置一个CheckBox的状态为选中(checked=true)
$("#checkbox_id").attr("checked",false); //设置一个CheckBox的状态为不选中(checked=false)
$("input[name='checkbox_name']").attr
("checked",$("#checkbox_id").attr("checked"));//根据3,4,5条,你可以分析分析这句代码的意思
$("#text_id").val().split(","); //将Text的Value值以','分隔 返回一个数组

jquery1.3.2

ISDARK : $("input[@type=radio][name=ISDARK][checked]").val()

$("input[name=radioname][value=radio值]").attr("checked","checked");



分享到:
评论

相关推荐

    jquery获取select,option所有的value和text的实例

    通过一个循环遍历所有option元素,并将每个元素的text和value组合成字符串,然后将这些字符串拼接到一个数组或一个长字符串中。 ```javascript var arr = new Array(); // 数组定义标准形式 var all = ""; // 定义...

    jquery根据name取得select选中的值实例(超简单)

    实例如下所示: &lt;select name=region[province] id= class=region valid&gt; &lt;option value=0 selected=selected tier=1&gt;省、直辖市&lt;/option&gt; &lt;option tier=1 value=2&gt;北京市&lt;/option&gt; &lt;/select&gt; var ...

    jQuery增加、删除及修改select option的方法

    jQuery获取Select选择的Text和Value: 1. //获取Select选择的Text var checkText=jQuery("#select_id").find("option:selected").text(); 2. //获取Select选择的option Value var checkValue=jQuery("#select_id...

    jquery 动态遍历select 赋值的实例

    若要获取这个select元素当前选中的值,可以使用.children('option:selected')来选择被选中的option元素,然后通过.val()方法来获取该选项的值,即 $("#selDepUnit").children('option:selected').val()。 知识点二...

    jquery获取select选中值的方法分析

    本文实例讲述了jquery获取select选中值的方法。分享给大家供大家参考,具体如下: 误区: 以前一直以为jquery获取select中option被选中的文本值,是这样写的: 复制代码 代码如下:$(“#s”).text(); //获取所有...

    JQuery操作select的实例代码

    selectBox.find('option[value="oldValue"]').text('新文本').val('newValue'); ``` ### 6. 触发事件 jQuery还允许你监听和触发`&lt;select&gt;`的事件,如`change`: ```javascript selectBox.on('change', function()...

    jQuery多选下拉框插件

    总之,`jquery.multi-select.js`是提高网页中多选下拉框用户体验的有效工具,它结合了jQuery的强大功能和易用性,使得Web开发变得更加简单和高效。无论是初学者还是经验丰富的开发者,都能从中受益。

    基于jQuery的select下拉框选择触发事件实例分析

    本文实例讲述了基于jQuery的select下拉框选择触发事件实现方法。分享给大家供大家参考,具体如下: 我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: &lt;select&gt; ...

    jquery操作select大全

    以下是一个综合实例,展示了如何使用jQuery监听select元素的变化,并在变化时获取选中的option的文本或值,并对select进行一些基本操作: ```javascript &lt;script src="jquery-1.2.1.js" type="text/javascript"&gt; ...

    jquery根据一个值来选中select下的option实例代码

    在网页开发中,jQuery 是一个常用的 JavaScript 库,它提供了许多便利的方法来操作 DOM 元素,包括选择、修改和操作 Select 下的 Option 元素。本文将详细讲解如何使用 jQuery 根据一个值来选中 Select 下的 Option...

    jQuery下拉框图片选择特效imageselect.js示例

    本示例“jQuery下拉框图片选择特效imageselect.js”是利用jQuery的强大力量来提升用户界面的美观性和交互性。在这个项目中,我们将会探讨如何使用这个插件来实现一个具有图片选择功能的下拉菜单,从而让传统的...

    jquery操作select元素和option的实例代码

    在本实例中,我们将深入探讨如何使用jQuery来操作`select`元素及其内部的`option`选项。 首先,我们需要引入jQuery库,这可以通过在HTML文档的`&lt;head&gt;`部分添加jQuery的CDN链接或者本地路径来实现。在这个例子中,...

    jquery获取当前选中下拉框的各个属性

    ### 使用jQuery获取与...以上介绍了如何使用jQuery来获取和设置下拉框(`&lt;select&gt;`元素)及其子`&lt;option&gt;`元素的各种属性。这些技巧对于Web前端开发者来说是非常实用的,可以帮助快速高效地完成交互逻辑的设计与实现。

    jquery ajax函数调用xml文件select表单全国城市

    对于每个城市,我们获取其ID和名称,并创建一个新的&lt;option&gt;元素添加到&lt;select&gt;中。最后,错误回调函数用于提示用户当加载XML文件时发生问题。 这个过程能够实现动态加载全国城市数据到网页的下拉菜单中,提高用户...

    jQuery基于vue.js下拉框菜单选择和日期时间选择代码

    在JavaScript中,确保Vue实例和jQuery代码正确配合,可能需要在Vue的`mounted`生命周期钩子中初始化日期时间选择器,以确保DOM已经加载: ```javascript new Vue({ el: '#app', data: { selectedOption: '', ...

    jquery select2 select美化插件

    **jQuery Select2 美化...综上所述,jQuery Select2 是一个功能强大的选择框美化插件,其丰富的特性和灵活性使其在现代Web开发中具有广泛的适用性。通过深入理解和熟练运用,我们可以创建出更加用户友好的交互界面。

    jquery操作Radio、Checkbox、Select Demo

    var selectedText = $('#select1 option:selected').text(); // 获取选中项的文本 ``` 4. **监听Select变化事件**: ```javascript $('#select1').on('change', function() { console.log('Selected option:',...

    jQuery Select下拉框美化代码.zip

    本文将详细探讨如何使用jQuery实现下拉框的美化,并结合"jQuery Select下拉框美化代码.zip"中的实例进行解析。 首先,jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理和Ajax交互,使得开发者能更高效地...

Global site tag (gtag.js) - Google Analytics