Question

我在使用jQuery获取输入值时遇到问题。

最终编辑： 问题解决了。该死的，我错过了

=

对于输入代码中的value属性，

我为这个愚蠢的错误而苦苦挣扎..笑了表情符号..

如果我使用

$("input[name=xxx]:checked").attr("value");

返回未定义

如果我使用

$("input[name=xxx]:checked").val();

它返回ON（错误，不是值。）

编辑： 使用js动态创建输入。

<div id="ab">
<input type="checkbox" name="aaa" value="apple">apple
<input type="checkbox" name="aaa" value="banana">banana
<input type="checkbox" name="aaa" value="grapes">grapes
<input type="checkbox" name="aaa" value="pista">pista
<input type="checkbox" name="aaa" value="badam">badam
<input type="checkbox" name="aaa" value="fruit">fruit
</div>
<div id="abcd"></div>

并选中上面的一些，然后选择下面的

var data="";
$('input[name=aaa]:checked').each(function() {
data += $(this).attr('value')+": <label class=\"badge badge-secondary mx-1\"><input type=\"radio\" name=\"xxx\" value\""+$(this).attr('value')+"\">A</label><label class=\"badge badge-secondary rounded-circle mx-1\"><input type=\"radio\" name=\"yyy\" value\""+$(this).attr('value')+"\">B</label>";
});
$('#abcd').html(data);

一个收音机可以正确地创建内容，但是最终在获取被检收音机的价值方面遇到了问题（用户只能在不同的物品中选择两个）。

某些jQuery函数不适用于动态生成的内容，例如

$("#xxx").click(function(){});

页面加载后不适用于使用js创建的内容，

$("body").on("click", "#xxx", function(){});

这适用于页面加载后用js创建的内容，

也许，类似地，页面加载后还会有另一个获取使用js创建的Input值。

Answer 1

如果未在元素中指定值，则复选框的默认值为“ on”和“ off”。如果该复选框具有特定含义，则可以在value属性中指定该复选框。

例如，假设我们希望用户超过18岁的人选中该框。我们可以做类似的事情：

<input id="checkbox" type="checkbox" value="over 18"/>

然后，当您查询其值$("#checkbox").attr("value")时，您将获得“超过18”的值。

如果您不想以这种方式指定值，并且您正在使用复选框旁边的文本标签，则可以执行以下操作：

HTML：

<input type="checkbox" id="checkbox" name="checkbox"/>
<label for="checkbox">Over 18?</label>

JS：

let text = $("label[for=checkbox]").text();

这将为您提供标签文字，即“ 18岁以上？”。

更新

对于OP更新的情况，您也许可以通过jQuery使用$(staticAncestors).on(eventName, dynamicChild, function() {});之类的东西。

示例：

首先，在动态创建复选框（例如class = "your_class_name"）时，为class属性分配一个类名。

然后，执行以下操作：

$(document).on('click', '.your_class_name', function() {
    console.log($(this).is(':checked'));
    // Do something with selected element
});

请参见https://api.jquery.com/on/#on-events-selector-data-handler，尤其是关于直接和委托事件处理程序

的部分

希望这会有所帮助。

Answer 2

使用 $("input[name=xxx]:checked")[0].value

因为它可能返回输入数组，所以必须先从数组中选择

jQuery返回UNDEFINED或ON作为输入值

2 个答案:

更新