Question

这样的在线编辑器

我已经尝试过使用JQuery的keyup();函数，但我似乎无法让它工作。这是我到目前为止所做的：

<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script>

<script type="text/javascript">
$("#idinput").keyup( function() {
$("#idoutput").html($("#idinput").val());
} );
</script>
</head>
<body>


<textarea id="idinput"></textarea>
<br>
<div id="idoutput"></div>
</body>
</html>

如果我犯了一些简单的错误，请告诉我。我是JQuery的新手，这是我到目前为止写的最复杂的事情。

我意识到之前可能会问过这个问题，但其他解决方案都没有奏效。提前谢谢。

Answer 1

您的脚本在textarea和div之前执行。尝试使用以下代码包装代码，以延迟执行直到文档准备就绪。

$(document).ready(function() {
  // Your code here.
});

Answer 2

<script type="text/javascript">
$(document).ready(function() {
   $("#idinput").keyup( function() {
   $("#idoutput").html($("#idinput").val());
} );
});
</script>

Answer 3

浏览器从上到下提取HTML文件。您在HTML元素<textarea>和<div>之前编写了JavaScript代码。

JavaScript代码在加载时直接解释和执行（除非它位于函数内）。因此，当您的网页仍在加载时JavaScript已经运行，因此无法找到您的HTML元素。

您应该将现有代码包装到$(document).ready(function(){ ... })（使用JQuery）或window.onload = function(){ ... }（JQuery函数以更简洁的方式执行）。这些函数中的代码在页面完全加载时执行，因此您的元素将被加载和使用。

尝试自己编辑文本

3 个答案: