Question

我在JavaScript中制作一个简单的单词计数器程序。我在JavaScript世界中相当新，请原谅我，如果我问一个简单而简单的问题。我正在使一切正常工作，textarea的文本字符串被分成单词数组，我可以将单词数记录到控制台但不能将它们显示到我希望它们出现的文本字段中。希望有人可以在这里提供帮助。感谢

var btn = document.getElementById("btn");
var numWords = document.getElementById("output");
var str = document.getElementById("txtBox");
btn.onclick = function()
{
   var words = str.value.split(" ");
   numWords.innerHTML.value = words.length;
   console.log( words.length );
   
};

.container
{
  width: 600px;
  margin: 0 auto;
}

textarea
{
  width: 560px;
  padding: 10px;
  background-color: #dfdfdf;
  color: #333;
  font-size: 18px;
}

input 
{
  text-align: center;
  padding: 10px;
  margin-top: 15px;
}

input[type="submit"]
{
  float: right;
  margin-right: 15px;
  background-color: #84ac49;
  border: 0;
  color: #fff;
  font-weight: bold;
}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  
    <div class="container">
        <from>
            <textarea name="txtBox" id="txtBox" cols="30" rows="10"></textarea><br/>
            <input type="text" value = 0 id="output">
            <input type="submit" value="Count Words" id="btn">
        </from>
    </div>
</body>
</html>

Answer 1

在点击功能事件中移动获取值

btn.onclick = function()
{
    var str = document.getElementById("txtBox").value
    var words = str.split(" ");
    numWords.value = words.length;
    console.log( words.length );

 };

JSFIDDLE

Answer 2

<script>

jQuery(document).ready(function() { 

function isTouchDevice() {
    return true == ("ontouchstart" in window || window.DocumentTouch && document instanceof DocumentTouch);
}
if (isTouchDevice() === true) {
$(".sub-menu").hide();


$(".menu-item-has-submenu").bind("click touchstart", function(){
  alert("This was clicked.");
  $(".sub-menu").toggle();

  }      
} 

});


</script>

你也可以像这样设置输入：

btn.onclick = function () {
    var words = str.value.split(" ");
    numWords.value = words.length;
    console.log(words.length);
};

Answer 3

当您点击计数按钮时，您将获得字数。

HTML

<textarea id="inputString" cols="50" rows="4"></textarea>
    <br>
    <input type="button" name="Convert" value="Count Words" onClick="countWords();"> 
    <input id="wordcount" type="text" value="0" size="6">

的Javascript

 countWords=function(){
    s=document.getElementById("inputString").value;
    s = s.replace(/(^\s*)|(\s*$)/gi,"");
    s = s.replace(/[ ]{2,}/gi," ");
    s = s.replace(/\n /,"\n");
    document.getElementById("wordcount").value = s.split(' ').length;
}

以下是演示：https://jsfiddle.net/DhwaniSanghvi/tdn3x72g/

有人可以解释为什么我的输入字段值没有变化

3 个答案: