javascript - 将 JS 函数输出输出到文本区域

Question

尝试让这个函数输出到下面的文本区域。下面的当前代码可以工作，但它接管整个页面而不是输出到文本字段。我知道两者没有正确连接。我已经对此进行了相当长的一段时间的修改，它现在让我发疯，所以这是这个脚本的最后一个稳定版本。

有什么建议吗？

  function doStuff()
  {
    var clkUrl = document.getElementById("clkUrl");
    var clkName = clkUrl.value;
    var assetUrl = document.getElementById("banUrl");
    var assetName = assetUrl.value;
    var impUrl = document.getElementById("impPix");
    var impName = impUrl.value;


    document.write('&lt;a href="'+clkName+'" target="_blank"&gt;'+'<br>');
    document.write('&lt;img src="'+assetName+'"&gt;'+'<br>');
    document.write('&lt;/a&gt;'+'<br>');
    document.write('&lt;img src="'+impName+'"&gt;'+'<br>');
  }

<input name="maininput" id="clkUrl" type="text" placeholder="Click Tracker" autofocus>
<br>
<input id="banUrl" type="text" placeholder="Asset URL">
<br>
<input id="impPix" type="text" placeholder="Impressions Pixel">
<br>
<input type="button" value="Get iFrame" onClick="doStuff()">
<br><br>
<textarea id="iframeoutput" rows="8" cols="50"></textarea>

Answer 1

您需要设置innerHTML <textarea>的属性(property)。与正常不同<input> s，<textareas>没有 value 属性，它们呈现开始和结束标记之间的内容。

所以doStuff()函数变为:

  function doStuff() {
      var clkUrl = document.getElementById("clkUrl");
      var clkName = clkUrl.value;
      var assetUrl = document.getElementById("banUrl");
      var assetName = assetUrl.value;
      var impUrl = document.getElementById("impPix");
      var impName = impUrl.value;

      var output = document.getElementById("iframeoutput");
      output.innerHTML = '&lt;a href="' + clkName + '" target="_blank"&gt;' + '<br>';
      output.innerHTML += '&lt;img src="' + assetName + '"&gt;' + '<br>';
      output.innerHTML += '&lt;/a&gt;' + '<br>';
      output.innerHTML += '&lt;img src="' + impName + '"&gt;' + '<br>';
  }

查看此working jsFiddle .