我想知道如何使我的函数仍然处于活动状态,即使我按了退格键/删除键,它仍然可以工作,而且我还想获得函数的select
值。这将取决于我的select
的值
这是我的代码:
<label class="control-label" for="discountType">Type</label>
<div class="controls" >
<select id="discountType" name="discountType" class="span10" required>
<option value="PR">Percentage</option>
<option value="P">Peso Value</option>
</select>
</div>
<label class="control-label" for="discountValue">Discount Value</label>
<div class="controls">
<input type="text" id="discountValue" name="discountValue" maxlength="3" placeholder="numbers and decimals only" class="span10" required><br>
<span id="value-min" style="text-align: right; color: red; width: 250px; text-align: left; font-size: 12px;"></span>
</div>
这是我的脚本:
$(document).ready(function(){
$("#discountType").on("ready",function(){
var disType = $("#discountType").val();
if (disType == "PR"){
$("#discountValue").on("keyup",function(){
var disval = $("#discountValue").val();
if (disval.trim().length >= 3){
$("#value-min").html("<span> Discount value cannot be larger than 99 if discount type is PERCENTAGE</span>");
}else{
$("#value-min").hide()/*html("")*/;
}
});
}else{
$("#value-min").hide()/*html("")*/;
}
});
});
但它不起作用。
实际上,您也可以在该span上使用纯隐藏/显示,并将值初始放置。示例:
<label class="control-label" for="discountType">Type</label>
<div class="controls" >
<select id="discountType" name="discountType" class="span10" required>
<option value="PR">Percentage</option>
<option value="P">Peso Value</option>
</select>
</div>
<label class="control-label" for="discountValue">Discount Value</label>
<div class="controls">
<input type="text" id="discountValue" name="discountValue" maxlength="3" placeholder="numbers and decimals only" class="span10" required><br>
<span id="value-min" style="text-align: right; color: red; width: 250px; text-align: left; font-size: 12px; display: none">
Discount value cannot be larger than 99 if discount type is PERCENTAGE
</span>
</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#discountValue').on('keyup focus', function(e){
var value = $('#discountValue').val();
var disType = $("#discountType").val();
if(disType == 'PR' && value > 99) {
$('#value-min').show();
} else {
$('#value-min').hide();
}
});
});
</script>