代码之家 › 专栏 › 技术社区 › Elaine Byene

显示任意数字输入的数据

jquery javascript

Elaine Byene · 技术社区 · 7 年前

当用户输入000000到999999之间的任何6位代码时,我想以给定格式显示英国伦敦的输出。

我怎么知道的?

const $main = $('#zipcode');
const $inputs = $('.location');
const values = {
  trigger: '100200',
  birds: ['London', 'England']
};
$main.on('keyup', function() {
  if (this.value === values.trigger) {
    $inputs.each(function(i, el) {
      el.value = values.birds[i];
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input type="number" id="zipcode" class="form-control" required>
<hr />
<input type="text" id="location1" class="location" required>
<input type="text" id="location2" class="location" required>

6 回复 | 直到 7 年前

Alexandre Elshobokshy 7 年前

你只需要替换 this.value === values.trigger 具有 this.value.toString().length === 6

这将检查输入的数量是否等于6,而不考虑实际输入是什么。

const $main = $('#zipcode');
const $inputs = $('.location');
const values = {
  trigger: '100200',
  birds: ['London', 'England']
};
$main.on('keyup', function() {
  if (this.value.toString().length === 6) {
    $inputs.each(function(i, el) {
      el.value = values.birds[i];
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input type="number" id="zipcode" class="form-control" required>
<hr />
<input type="text" id="location1" class="location" required>
<input type="text" id="location2" class="location" required>

Anki 7 年前

我们可以在修剪后检查输入值的长度(只是为了避免多余的空格),并验证输入是否为整数值。

const $main = $('#zipcode');
const $inputs = $('.location');
const values = {
  trigger: '100200',
  birds: ['London', 'England']
};
$main.on('keyup', function() {
  var thisValue = (this.value).trim();
  if (thisValue.length == 6 && !isNaN(thisValue)) {
    $inputs.each(function(i, el) {
      el.value = values.birds[i];
    });
  }
});

Gaurav joshi 7 年前

const $main = $('#zipcode');
const $inputs = $('.location');
const values = {
  trigger: '100200',
  birds: ['London', 'England']
};
$main.on('keyup', function() {
  if (this.value.length >= 6 && this.value >=0 && this.value <= 999999) {
    $inputs.each(function(i, el) {
      el.value = values.birds[i];
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input type="number" id="zipcode" class="form-control" required>
<hr />
<input type="text" id="location1" class="location" required>
<input type="text" id="location2" class="location" required>

Luis Curado 7 年前

if (this.value.toString().length === 6)

Sujit Agarwal 7 年前

在你的条件下试试这个=

if (this.value >= 0 || this.value <=999999) {

Priya Goud 7 年前

const $main = $('#zipcode');
const $inputs = $('.location');
const values = {
  trigger: '100200',
  birds: ['London', 'England']
};
$main.on('keyup', function() {
    if (Number.isInteger(this.value)) {
        if(this.value>=000000 && this.value<= 999999){
            $inputs.each(function(i, el) {
            el.value = values.birds[i];
            });
        }    
    }
});