選中復選框時，警報文本框為空

Question

這可能有點令人困惑，但請多多包涵。 我需要2個文本框和1個復選框。 選中復選框后，需要檢查文本框是否已填充。 如果填寫了文本框，則不會執行任何操作。

我為此感到非常掙扎，因此我將不勝感激。 如果您不明白我什至在說什么，這是我需要解決的問題。

*在order.html頁面中，在帳單地址字段附近的適當位置創建一個標簽為“與送貨地址相同”的復選框。 選中此復選框后，帳單地址字段將自動填充送貨地址。 如果選中此復選框后送貨地址未完成，則顯示警告或內聯消息：“請先輸入您的送貨地址”。 *

我設法用這些代碼重復了一部分。（地址和郵政編碼分開了）

function copy() {
var daddress = document.getElementById("daddress");
var baddress = document.getElementById("baddress");
baddress.value = daddress.value;
var dpost = document.getElementById("dpost");
var bpost = document.getElementById("bpost");
bpost.value = dpost.value;  
}

但是，在此之后我無法弄清楚那部分。

這是復選框的代碼

<input id="duplicate" type="checkbox" name="duplicate"
value="Duplicate" onClick="copy();"/>Same as delivery address
<p id="dalert"><b><i>Please  enter your delivery address first</i></b><p>

Answer 1

在這種情況下，您可以使用文本區域作為地址：

<textarea id="delivery-address"></textarea>

然后，您將使用JavaScript通過以下方式獲取其內容：

var deliveryAddress = document.getElementById("delivery-address").value.trim();

要檢查他們是否輸入了地址，您可以使用：

if (deliveryAddress === "") { ... }

在大多數情況下，地址會分為幾個輸入，通常是街道地址的兩行，城市，州和郵政編碼的輸入。

警報顯示如下：

alert('Some text');

Answer 2

您可以使用if語句在設置輸入之前檢查是否有任何輸入。

if (daddress.value && dpost.value) {
    baddress.value = daddress.value;
    bpost.value = dpost.value;
} else {
    alert('Please enter your delivery address first!');
    e.preventDefault(); // Stops checkbox from becoming checked.
}

JSFiddle

編輯：忘了提，使用e.preventDefault()你需要改變你的函數接受e參數（ function copy(e) {...}並通過event在你的onclick事件（ onclick="copy(event)" ）。 您會在JSFiddle中看到它們。