如何在jQuery中设置没有值的HTML属性(例如选中，选择，禁用）

How to set HTML attributes without values (e.g checked, selected, disabled) in jQuery

本文关键字：属性 禁用 选择 jQuery 设置 HTML      更新时间：2023-09-26

可能的重复项：
设置不带值的属性

有时，在使用 HTML 时，需要在不使用任何值的情况下设置 DOM 元素的属性，例如，请参阅此处的 selected 参数：

<select id="auto-makers">
  ...
  <option value="fiat" selected>FIAT</option>
  <option value="ford">FORD Motor Company</option>
  <option value="gm">General Motors</option>
  ...
</select>

HTML文档中的这种属性并不罕见。例如，以下是可能的属性列表：

  • checked ;
  • selected ;
  • required ;
  • multiple ;
  • disabled ;
  • 等等。

如何使用Javascript和/或jQuery在运行时设置没有值的属性？

按照您的示例，假设您有

<select id="auto-makers">
  ...
  <option value="fiat">FIAT</option>
  <option value="ford">FORD Motor Company</option>
  <option value="gm">General Motors</option>
  ...
</select>

并且您希望将 selected 属性添加到<option>，以便value="fiat" .因此，使用纯Javascript，您可以使用setAttribute方法：

var select = document.getElementsById('auto-makers');
for (var i=0; i<select.options.length; i++){
   if (select.options[i].value=="fiat"){
     select.options[i].setAttribute('selected','');
     break;
   }
}

而使用 jQuery，您可以简单地使用 attr 方法：

$('#auto-makers').find('option[value="fiat"]').attr('selected','');

在这两种情况下，空字符串都作为属性的值传递。

您可以通过在提供更改后查看相关的 HTML 代码来验证输出是否为所需的输出。

最后，请注意，类似的问题是："设置没有值的属性"。

相关文章：