Question

我想在文本区域中从用户那里获取输入，然后在数组中解析这些句子，然后使每个句子变得可以克隆，以便将单击的句子复制到另一个文本框中。因此，为了实现这一点，我尝试在文本区域中创建span元素，并且每个span都有类句子，因此在单击时它会将该句子复制到另一个文本区域。但是内部HTML不会产生跨度。相反，它明确地将它作为字符串写在textarea中。

＆＃13;

document.getElementById("go").onclick = function() {
  var lines = $('#input').val().split(".");

  for (var i = 0; i < lines.length; i++) {

    var line = lines[i];

    var para = document.getElementById("output");
    var htmlButton = ' <span class="sentence">' + line + "</span>";

    para.innerHTML = para.innerHTML + htmlButton;
  }
};



$('.sentence').click(function(e) {
  console.log("%00");
  var sentence = $(this).text();
  $('#textplace').html(sentence);
});

＆＃13;

#input {
  height: 150px;
  font-family: "Courier New", Courier, monospace;
}

.sentence {
  font-family: "Courier New", Courier, monospace;
}

body {
  margin: 25px;
}

＆＃13;

<html>

<head>


  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>




</head>


<body>

  <div class="alert alert-info" role="alert">Enter multiple lines of things here and it will be converted to a Javascript array format.</div>
  <textarea id="input" class="u-full-width" placeholder=""></textarea>
  <div id="output"></div>
  <input id="go" class="button-primary" type="submit" value="Go!">

  <textarea id="textplace"></textarea>
</body>

</html>

＆＃13;

将textarea更改为除法后，innerHTML可以正常工作，但类句上的click函数不起作用。

Answer 1

在第7行，你做了一个错误更改

//para.innerHTMl
para.value

为什么因为您尝试访问具有属性值而不是innerHTML的textarea元素来获取数据。您可以将innerHTML用于＆＃39; div＆＃39; p＆＃39; p＆＃39;标签等。

单击函数不在类上工作

1 个答案: