Javascript Jquery`.find（）`找不到具有值的`document``输入`=

我有一个按钮，用于将输入附加到HTML DOM。
稍后，如果输入值与关键字匹配，我将使用一个按钮获取输入值。
在本例中为“a”

HTML

<button class="btn btn-info" id="btnAddInput">Add input</button>
<button class="btn btn-info" id="fetchValue">Fetch value</button>
<div id="inputs"></div>

添加输入
获取值

JS

$('#btnAddInput').on('click', function() {
  $('#inputs').append('<input type="text" class="myInput"><br>');
  });
$('#fetchValue').on('click', function() {
  var value = $(document).find('input[value="a"]');
  console.log(value);
});

$（'btnAddInput'）。在（'click'，function（）上{
$（“#输入”）。追加（“
”）；
});
$（'#fetchValue'）。在（'click'，function（）上{
var value=$（document.find（'input[value=“a”]”）；
console.log（值）；
});

小提琴：

我了解到，如果使用Jquery将HTML添加到DOM中，有时必须使用

document

作为选择器来查找元素。
但我在这件事上没有成功。

您添加的输入在我的代码中保存到mysql中。
如果您在开始时加载所有保存的输入，js代码将查找值。

---

那么，我遗漏了什么呢？

您混淆了与输入相关的各种

值。你不是唯一一个


值
属性指定输入的初始值。当输入的值发生变化时，它不会发生变化，因此，由于您添加了一个没有
值
属性的输入，然后键入它，它不会突然得到一个值属性，因此您无法根据该值搜索它

HTMLInputElement
实例上的
值
属性反映输入的当前值

还有
defaultValue
属性，它反映了
value
属性


如果需要根据输入的当前值查找输入，没有CSS选择器可以执行此操作，则需要使用更广泛的搜索和
过滤器
：

var inputsWithA = $("input").filter(function() {
    return this.value == "a";
});

下面是一个显示输入的
value
属性、
defaultValue
属性和
value
属性值的快速示例：


$（“按钮”）。在（“单击”，函数（）{
var输入=$（“输入”）；
msg（“输入的
值
属性为：“+input.val（）+””）；
msg（“输入的
defaultValue
属性是：'”+input.prop（“defaultValue”）+“”）；
msg（“输入的
值
属性为：“+input.attr（“值”）+””）；
msg（“我们只能将CSS与属性一起使用，因此，例如，
$（'input[value=\'original\'）
将找到它，但
$（'input[value=\\\\'+input.val（）+“\”]）
将不会：”；
msg（“
$（'input[value=\'original\'”）
找到了吗+
（$（'input[value=“original”]”）。长度？“是”：“否”）
);
msg（“
$”（'input[value=\”“+input.val（）+“\”]）
找到了吗+
（$（'input[value=“”+input.val（）+“]”）长度？“是”：“否”）
);
});
函数msg（html）{
$（“”）.html（html）.appendTo（document.body）；
}
在输入中键入内容，然后单击按钮：

点击我
您混淆了与输入相关的各种
值。你不是唯一一个


值
属性指定输入的初始值。当输入的值发生变化时，它不会发生变化，因此，由于您添加了一个没有
值
属性的输入，然后键入它，它不会突然得到一个值属性，因此您无法根据该值搜索它

HTMLInputElement
实例上的
值
属性反映输入的当前值

还有
defaultValue
属性，它反映了
value
属性


如果需要根据输入的当前值查找输入，没有CSS选择器可以执行此操作，则需要使用更广泛的搜索和
过滤器
：

var inputsWithA = $("input").filter(function() {
    return this.value == "a";
});

下面是一个显示输入的
value
属性、
defaultValue
属性和
value
属性值的快速示例：


$（“按钮”）。在（“单击”，函数（）{
var输入=$（“输入”）；
msg（“输入的
值
属性为：“+input.val（）+””）；
msg（“输入的
defaultValue
属性是：'”+input.prop（“defaultValue”）+“”）；
msg（“输入的
值
属性为：“+input.attr（“值”）+””）；
msg（“我们只能将CSS与属性一起使用，因此，例如，
$（'input[value=\'original\'）
将找到它，但
$（'input[value=\\\\'+input.val（）+“\”]）
将不会：”；
msg（“
$（'input[value=\'original\'”）
找到了吗+
（$（'input[value=“original”]”）。长度？“是”：“否”）
);
msg（“
$”（'input[value=\”“+input.val（）+“\”]）
找到了吗+
（$（'input[value=“”+input.val（）+“]”）长度？“是”：“否”）
);
});
函数msg（html）{
$（“”）.html（html）.appendTo（document.body）；
}
在输入中键入内容，然后单击按钮：

点击我
尝试每个功能

$('input').each(function() {
    if ($(this).val() == 'a') {
        console.log('a');
    }
});

尝试每个函数

$('input').each(function() {
    if ($(this).val() == 'a') {
        console.log('a');
    }
});

这是您需要的代码

$('#btnAddInput').on('click', function() {
$('#inputs').append('<input type="text" class="myInput"><br>');
});

$('#fetchValue').on('click', function() {
  var value = $('.myInput').val();
  console.log(value);
});

$（'btnAddInput'）。在（'click'，function（）上{
$（“#输入”）。追加（“
”）；
});
$（'#fetchValue'）。在（'click'，function（）上{
var值=$（'.myInput'）.val（）；
console.log（值）；
});

您可以在此处检查它是否正常工作：

这是您需要的代码

$('#btnAddInput').on('click', function() {
$('#inputs').append('<input type="text" class="myInput"><br>');
});

$('#fetchValue').on('click', function() {
  var value = $('.myInput').val();
  console.log(value);
});

$（'btnAddInput'）。在（'click'，function（）上{
$（“#输入”）。追加（“
”）；
});
$（'#fetchValue'）。在（'click'，function（）上{
var值=$（'.myInput'）.val（）；
console.log（值）；
});

您可以在此处检查它是否正常工作：

您缺少的是find返回一个对象数组，而不是一个值，并且值选择器仅使用初始值。您需要对每个
函数的值使用一个
，您现在必须对其进行处理

$(document).find('input').each(function () {
    if( $(this).val() == "a")
        console.log( $(this).val());
});

您缺少的是find返回一个对象数组而不是一个值，并且值选择器仅使用初始值。您需要使用