javascript - 只是尝试检查该值是否存在于数组中

原文 标签 javascript jquery

我正在尝试在jQuery中编写一个函数。



var arr1 = ["Jcob", "Pete", "Fin", "John"];
var str = $("#fname").val();
if (jQuery.inArray(str, arr1))
  $("#lname").text("Bob");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="fname" name="fname">
<input type="text" id="lname" name="lname">





请检查我的小提琴here

用户将执行的操作是,用户将在第一个输入框中提供值,jQuery函数将检查该数组中是否存在该值,它将使用给定的文本填充第二个输入框中。

最佳答案

三件事:


您需要在第一个输入中添加一个事件侦听器,以不断检查某人输入内容的时间。
在DOM中选择元素之前,请确保DOM已准备就绪。
您在这里完全不需要jQuery。像大多数事情一样,没有jQuery也很容易做到。




const names = [ "Jcob", "Pete", "Fin", "John" ];
document.addEventListener('DOMContentLoaded', function() {
  const fname = document.getElementById('fname');
  const lname = document.getElementById('lname');
  fname.addEventListener('input', function(event) {
    lname.value = names.includes(fname.value) ? 'Bob' : '';
  });
});

<input type="text" id="fname" name="fname">
<input type="text" id="lname" name="lname">





如果您坚持使用jQuery(我强烈建议您在精通本机DOM API之前不建议这样做):



const names = [ "Jcob", "Pete", "Fin", "John" ];
$(document).ready(function() {
  const $fname = $('#fname');
  const $lname = $('#lname');
  $fname.on('input', function(event) {
    if ($.inArray($fname.val(), names) > -1) {
      $lname.val('Bob');
    } else {
      $lname.val('');
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="fname" name="fname">
<input type="text" id="lname" name="lname">

关于javascript - 只是尝试检查该值是否存在于数组中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60270171/

相关文章:

jQuery Focus不会触发CSS焦点

javascript - 动态增长包含observables的observableArray

javascript - Angular的ng-class不会更新,而要评估的值是

javascript - 根据第一个表的行的降序总和创建另一个表

javascript - 使用 Javascript 上传进度(使用或不使用 XMLHttpRequest 2)

javascript - 更改数据表<tr>的背景颜色

javascript - jQuery的:修复if()的第一次失误

javascript - 隐藏所有表行,期望其中一个被选中

javascript - jQuery动画方法不起作用

javascript - 直到附加到DOM之后,主干的委托(delegate)事件才绑定(bind)事件