jq隐藏文本 数据展示

1.数据从后台传参过来 数据要整合完好

<p class="title_sign">城市</p>
                <div class="selects defult_color">  
              		<div class="select_city">
                          <select class="triangle" onchange='btnChange(this[selectedIndex]);' id="selectchange" >
                              <{if count($activeCity)< 1}>
                              <option value="">暂无活动城市</option>
                              <{else}>
                              <option value="">请选择城市</option>  
                              <{/if}>
                              <{foreach from=$activeCity key=char item=val}>
                                  <{foreach from=$val key=shkey item=item}>
                              <option attr-time="<{$item.date}>" attr-address="<{$item.address}>" attr-title="<{$item.title1}>"  value="<{$item.city_id}>"><{$char}> <{$item.city_name}></option>
                              <{/foreach}>
                              <{/foreach}>
                                    
                          </select>
                       </div>
                </div>
                <!--点击显示-->
                <p class="title_sign" id="xz_cc" style="display:none;">选择场次</p>
                <div id="selected_city" class="selected_city" style="display:none;">
                	<div class="city">
                		
                	</div>
                	<div class="time_adress">
                		<p></p>
                		<p></p>
                	</div>
                </div>

jq区块

 var comm = {};
//弹出团购详情信息
function btnChange(optionEle){
        comm.date =     $(optionEle).attr('attr-time'),
        comm.address = $(optionEle).attr('attr-address'),
        comm.title = $(optionEle).attr('attr-title');
    $('#selected_city').show();
    $('#xz_cc').show();
    
    $('#selected_city .city').text(comm.title);

    $('#selected_city .time_adress p:nth-child(1)').text('地点:'+comm.address);
    $('#selected_city .time_adress p:nth-child(2)').text('时间:'+comm.date);
   
}

上边代码是下来菜单 根据onchange 事件 获取对象将数据传输给下边 function 方法 拿到对应参数进行处理(事件 地址 名称)
同时对方法赋值 新的组合中 并展开(show) selected_city xz_cc 场次标题 以及数据

拿到的数据 一一对应给空值的P标签中 p:nth-child(1) (注释:代表p标签的第一个 同理 2 就是第二个p标签 jq知识)

$(’#selectchange’).children(“option:selected”).val(); 被选中的id

下拉框获取被选中的值方法
$(’#testSelect option:selected’).text();//选中的文本
$(’#testSelect option:selected’) .val();//选中的值

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值