jQuery的attr()方法的行为

13 浏览
0 Comments

jQuery的attr()方法的行为

这不是 ‘attr() vs prop()’的问题。

考虑下面这个非常简单的Web表单：

 

很明显，第一个单选按钮具有默认的checked属性，打开此Web表单会出现一个众所周知的图片：

\"enter

在编写jQuery脚本文件时，我尝试通过检查单选按钮来检查 - 虽然可以使用prop()以正确而不费力的方式完成，但我使用了attr()。

使用浏览器的控制台，我可以立即查看结果：

\"enter

\"enter

但我知道在检查所需的一个之前应取消所有输入，以期望得到正确的结果：

\"enter

\"enter

争论从这里开始，当重新复制第一步时：

\"enter

\"enter

我的问题是为什么会发生这种情况？单选按钮中没有勾选标记，在服务器端也没有值。

admin 更改状态以发布 2023年5月22日
0

1 答案

0 Comments

问题是与jQuery版本有关。这并不是一个漏洞，也没有随jQuery v3 alpha版本一起发布。\n\n然而，从jQuery v3 beta版本开始，removeAttr()被稍微改变了一下。\n\n在jQuery <3.*中，removeAttr()方法将动态/当前状态设置为false：\n\n

// Set corresponding property to false
if ( getSetInput && getSetAttribute || !ruseDefault.test( name ) ) {
    elem[ propName ] = false;

\n\n而在另一方面，attr()只设置默认状态（不是当前状态）。但在jQuery >= 3.0中，我们再也看不到这些行了。\n\n在除了v3.*（> 最终和beta版本）之外的所有版本中，我们不能期望这两行来检查收音机按钮：\n\n

$('input[name="type"]').removeAttr('checked');
$('input[value="3"]').attr('checked', true);

\n\n但是这三行可以同时使用：\n\n

$('input[name="type"]').removeAttr('checked');
$('input[value="3"]').attr('checked', true);
$('input[value="3"]').prop('checked', true);

\n\n或者更简单：\n\n

$('input[name="type"]').removeAttr('checked');
$('input[value="3"]').prop('checked', true);

\n\n（但请注意，有些JavaScript代码可能检查属性而不是属性。因此，您必须进行额外的 .atrr()）\n\n在早期版本中，最好根本不使用removeAttr()，只使用attr()，如下所示：\n\n

$('input[name="type"]:checked').attr('checked', false);
$('input[type="3"]').attr('checked', true);

\n\nremoveAttr()的这种行为变化也在Github上进行了讨论。\n\n感谢那些对此问题发表评论的人。

0