Question

我有一个文本字段，用于输入汽车注册号。注册基于年份，格式为GT 74454 12，最后一个数字12代表年2012意思是汽车在2012登记。我想要一个脚本，它将自动编码最后两位数字并影响下拉列表的值。

例如，如果年份范围为09 - 12，则下拉列表的值应为红色。如果其范围为13 - 16，则下拉列表的值应更改为蓝色。

HTML

<form id="form1" name="form1" method="post" action="">
  <label for="car_no"></label>
  <input type="text" name="car_no" id="car_no" />
  <label for="select"></label>
  <select name="select" id="select">
    <option>Color Code</option>
    <option>Red</option>
    <option>Blue</option>
    <option>White</option>
  </select>
</form>

http://jsfiddle.net/y18c2hzo/

EDIT
there are some registrations that comes in a different format too which goes like this "GT 74454 X". How do i make the script autodect if the last digit is an alphabet the value shoud change to white

Answer 1

请尝试以下代码。

$(document).ready(function(){
$("#car_no").change(function(){
  var value= $(this).val(),
      year = value.split(" ")[2];
  if(year >=9 && year<=12)
  	$("#select").val("Red")
    if(year >=13 && year<=16)
  	$("#select").val("Blue")
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form1" name="form1" method="post" action="">
  <label for="car_no">car number</label>
  <input type="text" name="car_no" id="car_no" />
  <label for="select"></label>
  <select name="select" id="select">
    <option>Color Code</option>
    <option>Red</option>
    <option>Blue</option>
    <option>White</option>
  </select>
</form>

希望这会对你有所帮助。

Answer 2

我做了一个简单的例子here。

$('#car_no').keyup(function (event) {
    var value = $(event.target).val();
    var year = parseInt(value.trim().substr(-2), 10);
    if (year >= 9 && year <= 12) {
        $('#select').val('Red');
    } else if (year >= 13 && year <= 16) {
        $('#select').val('Blue');
    }
});

此代码只检测文本输入上的keyup事件并检索其值。通过删除任何空格并获取字符串的最后两位并将其转换为整数来确定年份。然后，您可以比较年份的值并相应地调整组合框的值。

Answer 3

尝试

$('select').on('change', function() {
  alert( this.value ); // or $(this).val()
  if(your condition){
  $("select").css("background-color", "red");
  }else if (your condition){
  ///your codes
  }
});

根据文本字段中的最后2个变量更改下拉列表的值

3 个答案: