javascript - 当您使用javascript在输入字段中输入信息时填充文本区域

我试图从几个输入中获取值，然后将它们传递到表单外部的文本区域，而根本不提交表单，这是在同一页面上进行的。我正在使用javascript来执行此操作，因为当您在输入信息中输入信息时，我希望填充文本区域，因为我会将该文本区域用作地址，然后在地图上对其进行标记。下面是将address的值传递到文本区域所需的部分代码，因为我不是一个JavaScript专家，我需要在代码的下一部分中寻求帮助以在文本区域中显示该值。

function getaddress() {
var direccion = document.getElementsByName("direccion").value;
var colonia = document.getElementsByName("colonia").value;
var ciudad = document.getElementsByName("ciudad").value;
var estado = document.getElementsByName("estado").value;
var pais = "Mexico";
var zip = document.getElementsByName("zip").value;
var address = direccion, colonia, ciudad, estado, pais, zip;
}

一旦文本区域中充满了上述函数的值，我就可以在ID地址中投放广告，以从中获取文本并在地图上显示标记。地图的代码如下

function codeAddress() {

var address = document.getElementById("address").value;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
     map: map,
     draggable: false,
     position: results[0].geometry.location
});

在此先感谢大家。

最佳答案

以我的思维方式，更新地址字段的最简单方法是处理包含有问题的输入元素的表单上的keyup event：

function getaddress() {
    var direccion = document.getElementById("direccion").value;
    var colonia = document.getElementById("colonia").value;
    var ciudad = document.getElementById("ciudad").value;
    var estado = document.getElementById("estado").value;
    var pais = "Mexico";
    var zip = document.getElementById("zip").value;
    document.getElementById("address").value =
          direccion + " " + colonia + " " + ciudad + "\n" +
          estado + " " + pais + " " + zip;
};

document.getElementById("addressForm").onkeyup = getaddress;

演示：http://jsfiddle.net/P9ErU/

键入事件从用户键入的输入到其包含元素（最终一直到文档）“冒泡”，因此您不需要单独处理每个输入，尤其是在这种情况下，无论用户输入的是哪种输入，都一样。

我从您发布的代码开始，并进行了以下更改：


给输入一个id并使用document.getElementById()而不是getElementsByName()-后者旨在返回（潜在地）许多元素（因此其名称中的复数“ elements”）并不真正适合您的工作。
使用+运算符（而不是,）将这些值连接在一起。如果合适的话，也要像我的代码所示那样放置一些空格和/或换行符（如果不合适的话，很容易删除该部分）。
将结果文本放入文本区域。
我以为表单的ID为"addressForm"，但显然您可以适当地对其进行更改。

关于javascript - 当您使用javascript在输入字段中输入信息时填充文本区域，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13812799/