You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

请求实现点击单选按钮触发复制功能(基于给定按钮代码改造)

Solution: Trigger Copy Function on Radio Button Click

Got it, let's adjust your code to fire the copy function when a radio button is clicked instead of the regular button. Here's a complete, working implementation:

<html>
<script type="text/javascript">
function copy() {
  var field1 = document.getElementById("Field1");
  var field2 = document.getElementById("Field2");
  var field3 = document.getElementById("Field3");
  
  // Append combined value to Field2 (keeping your original logic)
  field2.value = `${field2.value}\n\r${field1.value}-${field3.value}`;
  
  // Clear input fields after copying
  field1.value = '';
  field3.value = '';
}
</script>

<!-- Required input fields (your copy function references these) -->
<input type="text" id="Field1" placeholder="Enter Field 1 value">
<input type="text" id="Field3" placeholder="Enter Field 3 value">
<textarea id="Field2" rows="5" cols="30" placeholder="Combined values will appear here"></textarea>

<!-- Radio button group (same name ensures mutual exclusivity) -->
<div>
  <input type="radio" name="qualification" id="radioOption1" onClick="copy();">
  <label for="radioOption1">Qualification Option 1</label>
  
  <input type="radio" name="qualification" id="radioOption2" onClick="copy();">
  <label for="radioOption2">Qualification Option 2</label>
  
  <input type="radio" name="qualification" id="radioOption3" onClick="copy();">
  <label for="radioOption3">Qualification Option 3</label>
</div>
</html>

Key Details:

  • Radio Grouping: All radio buttons share the same name attribute (qualification) so only one can be selected at a time—this is standard behavior for radio buttons.
  • Event Binding: The onClick="copy();" handler is attached directly to each radio button, so clicking any option will trigger your copy logic immediately.
  • Missing Elements: I added the Field1, Field2, and Field3 inputs since your original function relies on them (without these, the code would throw errors).
  • Syntax Cleanup: Fixed minor syntax gaps in your original function (added semicolons, used the stored element variables consistently instead of referencing IDs directly).

内容的提问来源于stack exchange,提问作者Marius Roos

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.26 11:01:16