Question

当复选框被打勾时，我想为另一个文本框分配一个文本框值。当我单击复选框时，这些值未显示在文本框中。

function filladdress() {
  var address1 = $("#delivery_address").val();
  var suburb1 = $("#delivery_suburb").val();
  var post1 = $("#delivery_postcode").val();
  var textbox = $("#same-address").attr('checked')

  if textbox.attr('checked', true)
  $("#billing_address").val(address1);
  $("#billing_suburb").val(suburb1);
  $("#billing_postcode").val(post1);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2>Delivery Address</h2>
  <p>Address</p>
  <input id="delivery_address" type="text" name="delivery_address" />
  <p>Suburb</p>
  <input id="delivery_suburb" type="text" name="delivery_suburb" />
  <p>PostCode</p>
  <input id="delivery_postcode" type="text" name="delivery_postcode" />
</div>
<label>
  <input type="checkbox" name="same-address" value="checked">
  same as delivery address
</label>

  <h2>Billing Address</h2>
  <p>Address</p>
  <input id="billing_address" type="text" name="billing_address" />
  <p>Suburb</p>
  <input id="billing_suburb" type="text" name="billing_suburb" />
  <p>PostCode</p>
  <input id="billing_postcode" type="text" name="billing_postcode" />
</div>

Answer 1

您当前的逻辑存在几个问题：

JS末尾有不必要的)。
从未调用filladdress()函数。大概您想在更改复选框时执行此操作。
if语句语法已损坏。首先，您需要将条件包装在括号中。其次，您使用的是attr()的setter，而不是getter，因此由于生成的jQuery对象的类型强制，条件将始终等于true。
HTML中没有#same-address元素。我认为这应该是复选框本身。
您缺少开头的<div>标签

一旦解决了所有这些问题，并添加了一个不引人注目的事件处理程序，则代码应如下所示：

$(function() {
  var $delAddress1 = $("#delivery_address");
  var $delSuburb1 = $("#delivery_suburb");
  var $delPostcode = $("#delivery_postcode");

  $("#same-address").change(function() {
    if (this.checked) {
      $("#billing_address").val($delAddress1.val());
      $("#billing_suburb").val($delSuburb1.val());
      $("#billing_postcode").val($delPostcode.val());
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <h2>Delivery Address</h2>
  <p>Address</p>
  <input id="delivery_address" type="text" name="delivery_address" />
  <p>Suburb</p>
  <input id="delivery_suburb" type="text" name="delivery_suburb" />
  <p>PostCode</p>
  <input id="delivery_postcode" type="text" name="delivery_postcode" />
</div>
<label>
  <input type="checkbox" name="same-address" id="same-address" value="checked">
  same as delivery address
</label>
<div>
  <h2>Billing Address</h2>
  <p>Address</p>
  <input id="billing_address" type="text" name="billing_address" />
  <p>Suburb</p>
  <input id="billing_suburb" type="text" name="billing_suburb" />
  <p>PostCode</p>
  <input id="billing_postcode" type="text" name="billing_postcode" />
</div>

Answer 2

您的if语句首先是错误的，其次没有任何东西触发filladdress函数

工作演示

function filladdress() {
  var address1 = $("#delivery_address").val();
  var suburb1 = $("#delivery_suburb").val();
  var post1 = $("#delivery_postcode").val();
  

  if ($("[name=same-address]").prop('checked')) {
    $("#billing_address").val(address1);
    $("#billing_suburb").val(suburb1);
    $("#billing_postcode").val(post1);
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2>Delivery Address</h2>
<p>Address</p>
<input id="delivery_address" type="text" name="delivery_address" />
<p>Suburb</p>
<input id="delivery_suburb" type="text" name="delivery_suburb" />
<p>PostCode</p>
<input id="delivery_postcode" type="text" name="delivery_postcode" />
</div>
<label>
  <input type="checkbox" name="same-address" onchange="filladdress()" value="checked">
  same as delivery address
</label>

<h2>Billing Address</h2>
<p>Address</p>
<input id="billing_address" type="text" name="billing_address" />
<p>Suburb</p>
<input id="billing_suburb" type="text" name="billing_suburb" />
<p>PostCode</p>
<input id="billing_postcode" type="text" name="billing_postcode" />
</div>

使用jQuery中的复选框使文本框值另一个文本框

2 个答案: