Javascript 运行两次而不是一次

Question

我做了下面的演示来简化我的大问题，当输入“第一个输入”，点击提交，点击返回“第一个输入”时，它会提醒一次。然而，刷新，当输入“第一次输入”，提交，然后输入“第二次输入”，提交，点击“第一次输入”，浏览器在打算运行一次时警告两次。有什么问题？如何解决这个问题？

HTML 文件 (index.php)

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<input id="inputtext" type="text">
<button id="submit">Submit</button>
<div id="returned_result"></div>


<script>
$("#submit").click(function(){

    var content=$("#inputtext").val(); //get the value of input field

    $.post("testclick2.php", {content:content}, function(result){
    $("#returned_result").prepend(result);
     });

    $("#inputtext").val(""); //clear the input area

})

</script>

testclick2.php

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<?php
$content=$_POST["content"];
echo "<div class=\"content\">".$content."</div>"."<br>";
?>

<script>
$(".content").click(function(){
    alert("clicked");
})
</script>

Answer 1

在添加监听器之前尝试将其删除:

$("#submit").off('click');
$("#submit").click(function(){...}

还有

$(".content").off('click');
$(".content").click(function(){...}