Javascript 复选框填充表单字段

我希望使用复选框填充表单字段

示例用户流： 访客填写运输信息字段，如姓名、地址、邮政编码、城市。 访问者可以选择复选框自动填充账单信息字段。 如果用户选中“与帐单信息相同”复选框，则“发货信息”字段 将输入数据复制/粘贴到账单信息字段中

请浏览：

J$是实现这一目标的最佳方式吗？ 请告诉我是否有更好的解决方案。

---

谢谢你的关注，好公民

您可以使用Jquery实现这一点。。首先将Property jquery库加载到项目或页面

如果你的复选框是这样的

<input type="checkbox" id="checkbox1" />

<!-- account form fields  -->
<input type="text" id="name" />
<input type="text" id="phone" />

<!-- billing form fields-->
<input type="text" id="name_billing" />
<input type="text" id="phone_billing" />

$(document).ready(function(){
 $("#checkbox1").change(function() {
  if(this.checked) {
   alert("checked ");
    //get the values of the filled fields
    $name = $("#name").val();
    $phone = $("#phone").val();
    console.log("name");
    // then add those values to your billing infor window feilds 

    $("#name_billing").val($name);
    $("#phone_billing").val($phone);

    // then form will be automatically filled .. 

  }
  else{
   $('#name_billing').val('');
   $("#phone_billing").val('');
  }
 });
});

检查js小提琴

如果要在取消选中时删除这些值，只需

---

我没有对此进行测试，但希望使用firebug可以对您起作用，我看到脚本正在加载。我的重点是将您的姓名复制到复选框上的账单信息姓名。我理解你的代码布局，但它不起作用。谢谢你的尝试！！你太棒了！是否已将适当的jquery库加载到项目中。。然后通过添加警报检查事件是否正常运行&请添加$document.readyfunction{code have give}；检查编辑你的例子是完美的！我的WordPress支持的站点正在加载jQueryV1.11.0，我已经为输入分配了正确的ID，但仍然失败！如果您访问上面的我的链接，您可以确认您键入的所有内容都已加载。再次感谢js fiddle，正如您所看到的，我已经加载了jQuery 1.11.0，警报会来吗？fire bug控制台呢？它是否显示name value console.log$name；&如果你对答案满意，请给它打分。。感谢CF7的支持，它工作得很好！不过，使用CF7并不能——我也不明白。联系Form 7插件给我带来了问题。我发了这个帖子-