如何通过乘数值的下拉列表禁用输入
How to disabled input by dropdown list of multiplie value
我需要当下拉列表选择"自定义"时,它将启用"编辑"的输入字段。只有对于自定义,它才会启用,但必须禁用它。下面的代码
$(function() {
$('#drpevent').on('change', function(){
$('#ifedit').prop('disabled', this.value === 'custom');
});
});
table {border: 1px solid grey; }
input[type='number'] {width: 185px;}
input[type='checkbox'] {-ms-transform: scale(1.5) /* IE */
-moz-transform: scale(1.5); /* FF */
-webkit-transform: scale(1.5); /* Safari and Chrome */
-o-transform: scale(1.5); /* Opera */
padding: 10px;}
input[type="text"],[type="number"] {background-color: #333333;
border: 1px solid #000000;
border-radius: 4px;
width: 295px;
height: 30px;
color: #ffffff;
font-size: 15px;}
input:focus {
border: 2px solid #c67728;
box-shadow: 10px 3px 110px rgba(0,0,0,.25);
}
.left {text-align: left; color: #ffffff; top: 300px;}
.right {text-align: right;
align: left;
color: #ffffff;}
tr * {font-family: Arial, Helvetica, sans-serif;}
.input {
font-size: 15px;
border: 1px solid #000000;
border-radius: 4px;
background: -webkit-linear-gradient(#4a4a4a, #2f2f2f);
background: -o-linear-gradient(#4a4a4a, #2f2f2f);
background: -moz-linear-gradient(#4a4a4a, #2f2f2f);
background: linear-gradient(#4a4a4a, #2f2f2f);
width: 295px;
height: 30px;
color: #ffffff;
cursor: pointer;
}
.input:hover {
background: -webkit-linear-gradient(#6a6a6a, #444444);
background: -o-linear-gradient(#6a6a6a, #444444);
background: -moz-linear-gradient(#6a6a6a, #444444);
background: linear-gradient(#6a6a6a, #444444);}
.input:focus {background: -webkit-linear-gradient(#444444, #6a6a6a);
background: -o-linear-gradient(#444444, #6a6a6a);
background: -moz-linear-gradient(#444444, #6a6a6a);
background: linear-gradient(#444444, #6a6a6a);}
.input * { background:#333333;}
.disabled {opacity: 0.5;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table bgcolor="#000" border="0">
<tr><td colspan="2" class="left">Example</td></tr>
<tr><td class="right">If:</td><td>
<select id="drpevent" name="if" class="input right drp ">
<option value="click" id="click">click</option>
<option value="dblclick" id="dblclick">dblclick</option>
<option value="focus">focus</option>
<option value="mouseover">mouseover</option>
<option value="animationstart">animationstart</option>
<option value="animationend">animationend</option>
<option value="transitionend">transitionend</option>
<option value="mousedown">mousedown</option>
<option value="mouseenter">mouseenter</option>
<option value="mouseleave">mouseleave</option>
<option value="mousemove">mousemove</option>
<option value="mouseout">mouseout</option>
<option value="mouseup">mouseup</option>
<option value="orientationchange">orientationchange</option>
<option value="resize">resize</option>
<option value="scroll">scroll</option>
<option value="copy">copy</option>
<option value="touchend">touchend</option>
<option value="touchenter">touchenter</option>
<option value="touchleave">touchleave</option>
<option value="touchmove">touchmove</option>
<option value="touchstart">touchstart</option>
<option value="DomContentLoaded">Сразу при загрузке всех элементов</option>
<option value="load">В начале загрузке страницы</option>
<option class="cust" id="custom" value="custom">custom</option>
</select>
</td></tr>
<tr><td class="right">Edit:</td><td><input class="right disabled" id="ifedit" type="text" value="123" ></td></tr>
<tr>
<td class="right">
</tr>
</table>
我有这个脚本,我不知道如何使用乘法值来做到这一点。请帮助我)
这将
起作用
$(function() {
$('#ifedit').prop('disabled',true);
$('#drpevent').on('change', function(){
$('#ifedit').prop('disabled', $(this).val() !== 'custom');
($(this).val() == 'custom' ? $('#ifedit').css({'opacity':1}) : $('#ifedit').css({'opacity':0.5}));
});
});
因为在这种情况下禁用的道具有两个值真和假,直到值与"自定义"不同,它将禁用为真:)
相关文章:
- 在JS的下拉列表中选择多个输入参数
- 无法使用下拉列表检索表行中的输入值,但可以检索下拉值
- 在JavaScript中捕获select(下拉列表)上的键输入
- jQuery 设置和获取下拉列表和输入的本地存储数据
- 如何通过乘数值的下拉列表禁用输入
- jQuery检查自定义Google电子表格页面上输入和下拉列表的更改
- javascript的事件监听器将下拉列表转换为输入按钮
- Qualtrics(Javascript)-矩阵表-用下拉列表替换文本输入字段
- 如何在输入框中只显示名称,而在选择元素的下拉列表中显示名称和数字
- 响应式引导按钮,输入组中带有下拉列表
- 从动态生成的输入字段中获取下拉列表中的数据,而无需保存值 - jquery
- 选择下拉列表以输入具有预定义值的文本
- 下拉列表自动填充到页面上的文本(非输入字段)中
- 触发 html5 输入数据列表下拉列表显示
- 根据输入值添加和删除下拉列表中的选项
- 未在选择标记下拉列表中选择以隐藏其他输入元素的嵌套控制器
- 单击其他元素(文本输入)时显示下拉列表
- Ajax下拉列表,用于搜索输入以使用雅虎天气查找天气
- jQuery 使用两个下拉列表更改输入 css 样式
- 将下拉列表剃刀值设置为输入