jquery根据下拉框选择的值显示输入框
原理就是根据下拉框选择的值来控制显示那个输入框;
html代码:
首先定义一个下拉框,$serviceTypeList就是后台传过来的所有属性,
<div class="uk-form-group">
<label class=" uk-form-label">产品属性</label>
<div class="uk-form-controls">
<select data-dux="form-select" name="product_type_id" required>
<option value="">-请选择属性-</option>
<!--loop{$serviceTypeList as $vo}-->
<option value="{$vo.type_id}" <!--if{$product_type_id == $vo.type_id}-->
selected<!--{/if}--> >{$vo.type_name}</option>
<!--{/loop}-->
</select>
</div>
</div>
定义两个输入框
<input id="mian" type="text" name="area_limit" value="{$info.area_limit}" placeholder="请输入面积限制"></div>
<input id="ge" type="text" name="number_limit" value="{$info.number_limit}" placeholder="请输入个数限制"></div> jquery代码:
设置监听事件,当下拉框的值被改变了,判断这个值
$('#checkPointExpress').on("change",function(){
if ( document.getElementById('checkPointExpress').value == 1){
$('#mian').show();
$('#ge').hide();
}else {
$('#ge').show();
$('#mian').hide();
}
})
jquery根据下拉框选择的值显示输入框的更多相关文章
- dev下拉框选择不同值显示不同控件
单列的ASPxFormLayout直接前台控制就可以了,多列的前台控制后会出现空白 <dx:LayoutItem Caption="内容类型" Height="40 ...
- jQuery操作下拉框的text值和val值
jQuery操作下拉框的text值和val值 1,JS源码 <select name="select1" id="select1" style=" ...
- jquery 获取下拉框值与select text
下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. 下面先介绍了很多jquery获取select属性的方法,同时后 ...
- jquery获得下拉框值的代码
jquery获得下拉框值的代码 获取Select : 获取select 选中的 text : $("#ddlRegType").find("option:sele ...
- 使用 jQuery 实现页面背景色的更换,通过下拉框选择对应的颜色,页面背景会随着选中的颜色进行更换
查看本章节 查看作业目录 需求说明: 使用 jQuery 实现页面背景色的更换,通过下拉框选择对应的颜色,页面背景会随着选中的颜色进行更换 实现思路: 在页面中添加 <select> 标签 ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
- Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)
Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...
- Python+selenium之获取文本值和下拉框选择数据
Python+selenium之获取文本值和下拉框选择数据 一.结合实例进行描述 1. 实例如下所示: #新增标签操作 def func_labels(self): self.driver.find_ ...
- jQuery对下拉框Select操作总结
jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...
随机推荐
- Gradle在Android中的简单使用
Gradle在Android中简单的使用 还望支持个人博客站:http://www.enjoytoday.cn Android Studio 使用gradle进行工程构建,为了更好的了解整个andro ...
- logstash的安装,启动与输出
在相应的目录下 wget https://artifacts.elastic.co/downloads/logstash/logstash-6.6.2.tar.gz 解压 tar -zxvf log ...
- [b0003] 总览:Hadoop 个人学习路线进展
3. Spark 搭建 过 1.1 搭建伪分布式2.0.1 ok 2016-10-23 耗时 2h ref [0006] Spark 2.0.1 伪分布式搭建练手 后续: 1.2 分布 ...
- liteos MMU(十八)
1. 概述 1.1 基本概念 MMU全称"Memory Management Unit",顾名思义就是"内存管理单元". 1.2 运作机制 建立页表描述符号表, ...
- Linux:路径的概念及路径的切换
路径分为绝对路径和相对路径 绝对路径:从/根开头的路径为绝对路径 相对路径:以当前目录为开头的为相对路径 根目录:/ 家目录:普通用户的家目录在/home下,root用户的家目录是/root 切换目录 ...
- Vue生命周期钩子---2
vue生命周期简介 咱们从上图可以很明显的看出现在vue2.0都包括了哪些生命周期的函数了. 生命周期探究 对于执行顺序和什么时候执行,看上面两个图基本有个了解了.下面我们将结合代码去看看钩子函数的执 ...
- 详解Vue生命周期---1
目录 Vue实例的生命周期全过程(图) 在beforeCreate和created钩子函数间的生命周期 created钩子函数和beforeMount间的生命周期 el选项的有无对生命周期过程的影响 ...
- pycharm添加断点,分段运行,以及继续运行;
1.打断点,只需在代码的前面单机左键即可:2.运行,点击Debug...(如图,像贝壳一样的图标),只会运行第一个红点前的代码: 3.此时若想将第2个红点前的代码运行完毕:点击Resume Progr ...
- PHP常用数字函数以及排序函数
一:数字函数 .ceil() 进一取整 示例:ceil(0.9) 结果为1 .abs() 绝对值 示例:abs(-1) 结果为1 .rand() 随机数 示例:rand(1. 100) 1到100 以 ...
- 数据仓库010 - MySQL查看所有存储过程,函数,视图,触发器
.查询数据库中的存储过程和函数 方法一: select `name` from mysql.proc where db = 'your_db_name' and `type` = 'PROCEDURE ...