当复选框被选中时,警告文本框为空

Alert textbox is empty when checkbox is checked

本文关键字:文本 警告 复选框      更新时间:2023-09-26

这可能有点令人困惑,但请耐心听我说。我需要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>

在这种情况下,您可以使用textarea作为地址:

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

然后你会使用JavaScript来获取它的内容:

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

要检查他们是否输入了地址,您可以使用:

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

在大多数情况下,地址会被分成几个输入,通常两行是街道地址,一行是城市、州和邮政编码。

提示如下:

alert('Some text');

您可以使用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) {...})并在onclick事件(onclick="copy(event)")中传递event。您将在JSFiddle中看到这些