JS函数的用户输入到输出答案

【问题标题】：User Input to Output for JS functionJS函数的用户输入到输出
【发布时间】：2017-03-28 14:01:14
【问题描述】：

我正在尝试从 HTML 文件中获取用户输入，对其进行转换，然后使用 <input> 而不是提示符将其输出回页面。

这是我目前所拥有的。

function bhedTester() {
    alpha = "ABC";
    bhed = "JYI";

    btext = "";
    i = 0;

    while (i < norm.length) {
        ind = alphabet.indexOf(norm.charAt(i));
        btext = btext + bhed.charAt(ind);
        i++;
    }
    btext
}

我已经使用提示命令对此进行了测试并且它可以工作，但是当我去使用时

document.getElementById

或

document.form_name._input_name.value

然后返回似乎都不起作用。

谁能给点建议？

【问题讨论】：

不工作时的错误是什么？您是如何准确引用该元素的？
这是我一直试图让它在Fiddle中工作的小提琴
这表明了你的问题，当输入值改变时你没有调用它，你只是在页面加载时调用它。接下来你有一个错字，B in getElementById。
您能否进一步解释一下您的意思？（即前者）。
请将所有必要的代码作为minimal reproducible example 包含在问题本身中，而不是在第三方网站上。

标签： javascript html converter

【解决方案1】：

要写入 div，您必须这样做：

document.getElementById("yourDiv").innerHTML= bhedTester();

然后你需要从你写的函数中返回一个字符串。

现在它没有返回任何东西。

所以你的代码应该是这样的：

    function bhedTester() {
    alpha = "ABC";
    bhed = "JYI";

    btext = "";
    i = 0;

    while (i < norm.length) {
        ind = alphabet.indexOf(norm.charAt(i));
        btext = btext + bhed.charAt(ind);
        i++;
    }
    return btext;
}

由于我不知道你的norm 和alphabet 不能给你一个确切的解决方案。

【讨论】：

它基本上就像一个替换密码。字母只是顺序不同。我只留下三个作为测试点。
这是Fiddle，我一直在尝试使用它。似乎无法让该返回返回到出现的页面。
@ZynVak 你从哪里得到字母表？
Here。只是为了测试我的知识库。

【解决方案2】：

如果您从 DOM 事件触发此函数，则必须返回 btext。

function bhedTester() {
  var alpha = "ABC";
  var bhed = "JYI";

  var btext = "";
  var i = 0;

  while (i < norm.length) {
    var ind = alphabet.indexOf(norm.charAt(i));
    btext = btext + bhed.charAt(ind);
    i++;
  }
  return btext
}

【讨论】：

【解决方案3】：

您需要监听输入中的文本何时更改或单击按钮时。您的代码仅在页面加载时运行。当您键入文本时，它不会神奇地运行。您需要更改它以在用户更改文本时运行。所以需要使用 addEventListener 来绑定事件。

//bind the change event
document.getElementById("foo").addEventListener("change", function(){
    var textbox = this, //reference the textbox
        value = this.value;  //get what the user typed
    document.getElementById("bar").innerHTML = value;  //set the value
});

<input type="text" id="foo" />
<div id="bar" />

现在，如果您想在用户键入时运行它，则可以使用 keyup 事件。

【讨论】：

完美！我不确定这是否是我所缺少的。现在有道理了。谢谢。
所以我按照你提到的那样添加了这个，当我运行它时，它似乎接受了我输入的值，但没有任何东西发回。
那么您是否修复了我在原始代码中使用 getElementById 提到的错字？
是的。我认为问题出在我的document.getElementById("demo").innerHTML = bhedTester();