如何从textarea获取输入到javascript函数?

时间:2018-11-21 20:57:03

标签: javascript html function textarea

我正在尝试创建一个猪拉丁转换器,该转换器从文本区域获取输入并将其发送到我的javascript函数进行翻译。我按下了提交按钮,尝试时什么也没发生。

这是我的JavaScript代码:

function translate(String sentence) {

  String sentence = document.getElementById("sentence").value;
  int wordStart = -1;
  int wordEnd = -1;
  String letter;

  String fullSentence;
  for (int i = 0; i < sentence.length(); i++) {
    String trans;
    char c = Character.toLowerCase(sentence.charAt(i))

    if (wordStart === -1 && (c !== ' ' || c !== '.' || c !== ',' || c !== '!' || c !== '?')) {
      wordStart = i;
      letter = c;
    }

    if (wordEnd === -1 && (c === ' ' || c === '.' || c === ',' || c === '!' || c === '?' || i === sentence.length() - 1)) {
      wordEnd = i;
    }

    if (wordStart !== -1 && wordEnd !== -1 && (letter !== 'a' || letter !== 'e' || letter !== 'i' || letter !== 'o' || letter !== 'u')) {
      trans = sentence.subString(wordStart + 1, wordEnd) + letter + "ay";

      wordStart = -1;
      wordEnd = -1;
    }

    if (wordStart !== -1 && wordEnd !== -1 && (letter === 'a' || letter === 'e' || letter === 'i' || letter === 'o' || letter === 'u')) {
      trans = sentence.subString(wordStart, wordEnd) + "way";

      wordStart = -1;
      wordEnd = -1;
    }

    fullSentence = fullSentence + trans + " ";
  }

  document.getElementById("output").innerHTML = fullSentence;

}
<div style="font-size: 25pt; text-align: center">Pig Latin Translator</div><br /><br />

<div style="font-size: 15pt; text-align: center">

  Enter text to be translated:

  <form id="piglatin" action="">
    <textarea id="sentence" rows="5" cols="30"></textarea><br />

    <input type="button" name="submit" value="Submit" onclick="translate('sentence')" />
  </form>

</div>

<div id="output"></div>

基本上我不确定问题是否出在试图将信息发送到JS函数的地方,还是问题出在JS函数中。

3 个答案:

答案 0 :(得分:0)

在浏览器中打开开发人员工具。查看控制台。您将看到许多错误消息。

您似乎在写Java,但是JavaScript是一种完全不同的编程语言,与Carpet在Car上相比,Java的共同点几乎没有。

您在标题中提出的问题是您实际上正确的事情之一:document.getElementById("sentence").value;

MDN has some introductory JavaScript tutorials。您需要学习该语言,而不仅仅是编写Java。

答案 1 :(得分:0)

您的代码是Java,而不是javascript。

例如,可以这样重写代码(从语法上来说)。我很害怕,它并没有达到您的期望,但是它可以正常工作并且浏览器可以理解。

function translate() {

  var sentence = document.getElementById("sentence").value;
  var wordStart = -1;
  var wordEnd = -1;
  var letter;

  var fullSentence;
  for (var i = 0; i < sentence.length; i++) {
    var trans;
    var c = sentence.charAt(i).toLowerCase();

    if (wordStart === -1 && (c !== ' ' || c !== '.' || c !== ',' || c !== '!' || c !== '?')) {
      wordStart = i;
      letter = c;
    }

    if (wordEnd === -1 && (c === ' ' || c === '.' || c === ',' || c === '!' || c === '?' || i === sentence.length - 1)) {
      wordEnd = i;
    }

    if (wordStart !== -1 && wordEnd !== -1 && (letter !== 'a' || letter !== 'e' || letter !== 'i' || letter !== 'o' || letter !== 'u')) {
      trans = sentence.substring(wordStart + 1, wordEnd) + letter + "ay";

      wordStart = -1;
      wordEnd = -1;
    }

    if (wordStart !== -1 && wordEnd !== -1 && (letter === 'a' || letter === 'e' || letter === 'i' || letter === 'o' || letter === 'u')) {
      trans = sentence.substring(wordStart, wordEnd) + "way";

      wordStart = -1;
      wordEnd = -1;
    }

    fullSentence = fullSentence + trans + " ";
  }

  document.getElementById("output").innerHTML = fullSentence;

}

查看其他答案中提到的一些不错的JS教程会有所帮助。

快乐编码

您可以在我创建的JSFidddle中尝试针对页面脆弱的javascript函数。

答案 2 :(得分:0)

这是一些工作代码。您仍然需要修改逻辑,因为结果不准确。

Single