如何在页面加载时检查收音机答案

【问题标题】：How to have a radio checked on page load如何在页面加载时检查收音机
【发布时间】：2019-05-30 22:00:51
【问题描述】：

我有一个使用 Liquid Shopify 的捐赠页面。我无法更改 name="donation[amount_option]"（我无权访问该文件），因此我需要允许它保留的代码。

我希望在加载时自动检查 $250

我的代码

document.querySelector('input[name="donation[amount_option]"][value=250]').checked = true;

<div class="radio-inline donation-v2-amounts padbottommore">
  <span>
    <input id="donation_amount_25" type="radio" name="donation[amount_option]" class="donation_amount_option" value="25">
    <label for="donation_amount_25" class="radio">$25</label>
  </span>
  
  <span>
    <input id="donation_amount_250" type="radio" name="donation[amount_option]" class="donation_amount_option" value="250">
    <label for="donation_amount_250" class="radio">$250</label>
  </span>
  
  <span>
    <input id="donation_amount_1000" type="radio" name="donation[amount_option]" class="donation_amount_option" value="1000">
    <label for="donation_amount_1000" class="radio">$1,000</label>
  </span>
</div>

【问题讨论】：

您的第一段是说您根本没有能力直接更改html吗？似乎有些混乱。

标签： javascript jquery radio-button shopify liquid

【解决方案1】：

$(document).ready(function(){
    $('#donation_amount_250').prop('checked',true);
});

【讨论】：

【解决方案2】：

如果您需要纯 js 替代方案（除了上面的答案）。您可以按值选择：

document.querySelector('input[value="250"]').checked = true;

编辑：

如果不清楚，您可以使用任何有效的选择器，例如 id，即：

document.querySelector('#donation_amount_25').checked = true;.

【讨论】：

为什么不使用id？
谢谢！我依赖另一个帖子说我还需要 querySelector 的名称。
@SnowboardBruin 不，你不需要“特别”任何东西。只是一个有效的选择器，可以是任何东西。正如这个答案所暗示的，我使用 id 而不是 value 属性的观点是，id 被索引，并且查找速度更快。
当然可以使用id。选择 value 属性纯粹是任意的。

【解决方案3】：

只需将“checked”关键字添加到输入的末尾即可。

<input id="donation_amount_250" type="radio" name="donation[amount_option]" class="donation_amount_option" value="250" checked>

【讨论】：

用户在第一段中明确声明他们无权访问该文件
@Taplar 用户声明名称无法更改。
括号后表示他们无法访问该文件
意思是这个名字被另一个他无权访问的文件使用，这就是他们的措辞。它的字面意思是“我的代码”，这意味着可以访问。
那是在原帖的底部。