Question

我正在使用付款按钮生成器来创建特定的项目选项，以创建预先制作的价格无线电列表。当您选择所需的金额/项目时，然后单击“继续”，它会触发模态付款框（然后转到PayPal）。所有这一切都很有效。问题是预制选项让你没有地方添加描述或段落或任何其他HTML。所以我使用基本的html和内容添加了上面的项目列表，现在我正在尝试触发相应的无效电台选择器。

我的无序商品列表包含在基本div中，每个商品都有自定义ID。

<div id="items-container">
  <ul>
    <li id="item1"><div>my content</div></li>
    <li id="item2"><div>my content</div></li>
  </ul>
</div>

直接在此代码块下面是我正在使用的付款模块的预生成表单。它为这样的价格生成一个复选框选择：

<form method="post" action="#">
  <ul id="prices-wrap-radio-list">
    <li>
    <input type="radio" value="10.00" id="level-1" name="price-level" data-price-id="1">
    <label for="level-1">Level 1</label>
  </li>
  <li>
    <input type="radio" value="20.00" id="level-2" name="price-level" data-price-id="2">
    <label for="level-2">Level 2</label>
  </li>
  </ul>
</form>

（依此类推）。有没有办法强制表单选择上面列表中的项目的相关级别？我可以使用链接标记来包装我的LI标记，该标记会触发该特定项目/级别的复选框吗？或者我需要一些jQuery吗？

谢谢！

Answer 1

如果允许JQuery：

$('li').click(function() {
$(':radio[data-price-id="'+$(this).data('level')+'"]').prop('checked', true);
});

只需为列表项提供适当的属性：

<li id="item1" data-level="1"><div>my content</div></li>
<li id="item2" data-level="2"><div>my content</div></li>

编辑：如果您无法更改HTML结构，请尝试使用：

$('li').click(function() {
    index=$(this).index();
$(':radio').eq(index).prop('checked', true);
});

用LI选择无线电输入？

1 个答案: