下拉框触发使用Jquery改变＜input＞的结构

于 2023-03-20 16:53:18 发布
阅读量283 收藏
点赞数
文章标签： jquery javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_46093203/article/details/128833024
版权

现在有这样一个业务：
有一个下拉框（如图）想要更近下拉框的选择改变文本框中的type结构
逻辑：如果选择的时【以完成一定的工作为期限】需要【劳动合同到期时间】为为文本输入框；【无固定期】需要【劳动合同到期时间】赋值为【无期限截止】；【有固定期】需要有时间控件
在这里插入图片描述

				<tr>
					<td nowrap="nowrap" align="center"><font style="color:red;">合同类型</font></td>
					<td colspan="3">
						<select id="contractType" name="contractType"  elementname="合同类型" required="required" class=
最低0.47元/天 解锁文章
曾经的逍遥少年
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
input下拉选择后触发事件（原创）
Sudaofeng520的博客
06-22 5268
1：在平时的开发过程中，难免会遇到&lt;select&gt;&lt;input&gt;下拉框,我们有时候需要在选定下拉内容的同时希望触发事件，在这里有两个选择。如：&lt;select id="ddlApkType" name="ddlApkType" class="select2-selection__rendered" style="width: 114px; height: 29px;&am
jQuery模拟下拉框选择对应菜单的内容
10-20
在本文中，我们将深入探讨如何使用jQuery来模拟下拉框选择菜单的功能，这对于网页界面设计尤其有用，可以提供更友好的用户体验。下拉框在网页交互中常常用于节省空间并保持页面整洁，尤其是在有很多选项可供选择时。...
vue 避免渲染时闪烁
weixin_34279579的博客
05-15 290
&lt;!DOCTYPE html&gt; &lt;html lang="zh"&gt; &lt;head&gt; &lt;meta charset="UTF-8" /&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=
写一段html 根据下拉框的选择 出现不同的input
weixin_42603332的博客
02-13 236
这是一段使用 JavaScript 实现的示例代码： <html> <head> <script> function showInput(element) { if (element.value === "Option1") { document.getElementById("input1").sty...
input 内容改变的触发事件
MaQuanXin的博客
06-28 1220
input 内容改变的触发事件 onchange onchange 事件会在域的内容改变时触发。支持的标签, , ,。 注意：在元素的值改变了且失去焦点时触发（两次的值一样不会触发）。 缺陷：通过js代码改变DOM的值不会触发，解决在js代码里改值了调用其change 的function() 或者调.change()方法。 JS： <input type="text" id="cc" o...
input表单各种框/按钮和下拉框
热门推荐
你还有我
12-06 2万+
目录表单：1.1输入框label标签通用属性1.2密码框1.3单选框1.4多选框1.5 按钮1.6文件上传1.7隐藏域下拉菜单select常用属性option常用属性输入框fieldset为表单加一个框 表单： 用来收集用户输入或选择的信息，并提交到服务器上。 html表单是由网页上可以提供用户输入和选择的一些控件（表单元素）组成的 表单元素： 元素：HTML中，是从开始标签到结束标签中的所有代码。 表单元素指的是不同类型的控件。 输入框，密码框，复选框，提交按钮等。 表单格式：
input+select(multiple) 实现下拉框输入值
12-08
这里我们将探讨如何利用`input+select(multiple)`结构来达到这个目的，并解决在动态绑定下拉框选项时遇到的问题。 首先，`input`元素通常被用来创建一个文本输入框，让用户自由输入信息。而`select`元素则用于创建...
jQuery使用EasyUi实现三级联动下拉框效果
11-30
总结来说，使用jQuery和EasyUI实现三级联动下拉框的关键在于理解`combobox`组件的`loader`和`onSelect`事件，以及如何通过事件绑定和AJAX请求来实现数据的动态加载和联动更新。通过这种方式，我们可以创建出用户友好...
jQuery+easyui中的combobox实现下拉框特效
10-24
本篇文章将详细介绍如何在jQuery+EasyUI中使用Combobox实现下拉框特效。 首先，我们来看第一种实现方法。在HTML代码中，我们可以创建一个具有`easyui-combobox`类的`<input>`元素，并通过`data-options`属性设置其...
jQuery自定义多选下拉框效果
10-19
- 显示部分：`<div class="dropdown-display">` 是下拉框在未展开时显示的部分，包含一个`<span>`元素和一个只读的`<input>`元素，用于显示已选值和下拉图标。 - 搜索框：`<div class="dropdown-search">` 提供了...
HTML根据下拉框的值动态展示其他input框数据
汤圆的博客
01-04 1638
前端html 原生代码 <div class="col-sm-4 b-r"> <label class="col-sm-3 control-label">划转日期(季度)：</label> <select id="quatrdate" name="划转日期(季度)" underline="true"> <option value="月度">
vue中切换下拉页面内容，实时传送给后台（input 内容改变的触发事件）
青椒的博客
01-08 747
1.input 内容改变的触发事件 https://www.cnblogs.com/littlesummer/p/6428116.html 2. JavaScript监听input输入事件 <body> <input type="text" id="myInput" oninput="inputFunction()"> <p id="demo"></p...
js 事件委托
你如今的气质里，藏着你走过的路，经历过的事，读过的书，和爱过的人。
12-14 202
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
bootstrap 下拉菜单、输入框组样式
hugejihu9的专栏
12-12 1912
文章来自：源码在线https://www.shengli.me/css/414.html     效果：          
html将下拉列表转换成输入框,点击变input编辑内容,点击变下拉框
weixin_33835558的博客
06-01 442
Thedatabase.Seeyourchangeshere.ObjectFirstnameLastnameFavouritesDirectionpersonperson2SimpletextinputfieldFirstexampleisastraightforwardtextinput.Clickontheunderlinedtexttomodify...
jQuery监听下拉框选中内容发生改变
ithouse的专栏
07-25 2万+
$(document).ready(function(){ var defaultId = "${defaultSelected}"; $("select option").each(function(){ if($(this).val()==defaultId){ $(this).attr("sele
easyui 下拉框类控件使用注意
随风飘絮
05-07 747
easyui 下拉框类控件，如datebox ,combobox等 在使用的过程中可能出现这样的问题： 连续打开关闭几次后，其中的输入框会逐渐变小，直至看不到输入框 造成这个的原因是控件没有设置宽度 设置宽度后，就不会出现这个问题,其他类似
调整EasyUI中输入框(下拉，时间，文本框等)高度一致问题
IMSIB的专栏
03-30 387
默认情况下文本验证输入框easyui-validatebox高度为22px，而easyui-datebox，easyui-combobox默认高度为20px。 不光光是高度不一致的问题，而且还有距离底边也不相同。 因此不做任何修改时的页面展示会出问题(仔细看还是有出入的)，我的解决方法便是： 步骤如下： 3.就是将easyui.css文件中的combo类的 /*vertical-...
easyUI弹出下拉列表被窗口下端遮挡的解决方案
hmwz0001的博客
03-02 301
其中的panelHeight属性不能设置为auto,否则就会本窗口遮挡，必须设置为具体的数值：如：30px就会不被遮挡。秋风写于淄博，业务联系与技术交流：QQ:375172665。
jqueryui 可录入下拉框
最新发布
10-02
$(this).append("<option value='" + inputVal + "'>" + inputVal + "</option>"); $(this).val(inputVal); $(this).selectmenu("refresh"); } }); }); ``` 以上代码中，我们使用了selectmenu()方法初始化...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值