Javascript 按钮没有进入ajax

我真的很困惑，为什么第二种方法没有使用ajax：

一,。这是向ajax开火，好吗

第二种方法将相同的内容分配给innerHTML，但不起作用，当单击按钮时，没有响应，只有一个橙色边框发光

这是因为Chrome吗？

将其更改为使用。这样，所有动态元素都将得到保护

$(document).on("click","#comment_btn",function(){ //click write_comment a tag btn
  console.log ("ready-comment_btn: clicked comment_btn");
    $.post("cgi-bin/s_comment.pl", {
        comment:"HELLO WORLD IN READY",
    },
    function(data,status){
      document.getElementById('div_comment').innerHTML = data;
    });
  }); 

---

使用.on的委派风格如何：

---

此处为.on:

提供文档，这样您就可以知道这里发生了什么，当此代码运行时：$comment\u btn，如果该元素不存在，则不会选择任何内容，这意味着单击事件处理程序不会附加到任何元素。我已经有几年没有使用jQuery Mobile了，但是框架的AJAXy特性意味着您不想使用document.ready，而是在AJAXy环境中模拟document.ready的一个jQuery Mobile特定事件。您仍在尝试绑定到注释，\u btn，在代码运行时该注释可能存在，也可能不存在。如果要改为使用事件委派，则需要更改语法。第一个代码示例在功能上仍然与问题中的代码相同，因此关于在动态元素中使用.on的说明不正确。@jaspesi.on不会处理动态添加的元素？这取决于您如何使用它，在第一个示例中，不会。按照代码执行。。。首先选择一个元素，但请稍候，该元素不在DOM中，因此未选择任何内容，因此事件绑定绑定为nothing。。。在第二个示例中，您首先选择一个始终存在的元素，这很好，然后告诉jQuery将事件处理程序绑定到该元素，但只有当事件从与您作为第二个参数输入的选择器匹配的特定元素中冒泡出DOM时，才运行回调。那么为什么要进行否决投票：，您可以说第一个将不起作用。单击是指向的快捷方式。在上，这里的区别在于您使用的是委托事件处理程序，而不是直接绑定到不存在的元素。请向我解释一下，单击和仅单击之间的区别click@CindyTurlington.click[callback]是指向的快捷方式。在“click”上，[callback]。您正在寻找一个委托事件处理程序，如此答案中所示，它使用以下参数：。单击，[selector]，[callback]。委派的事件处理程序附加到一个元素上，您知道该元素在代码运行时存在于DOM中，主体始终存在，因此它可以工作，您还可以使用文档对象：$document.on[event]、[selector]、[callback]。@CindyTurlington请将此答案标记为有用？谢谢为什么innerHTML分配不起作用，它在客户端，在运行时可用

document.getElementById('div_comment').innerHTML = "<br> <br> <textarea name=\"text_comment\" id=\"text_comment\" placeholder=\"160 chars or less, no # or @\" data-role=\"none\" rows=11 cols=20 onkeypress=\"if(event.keyCode==13){return false;}\" onKeyDown=\"limitText2(this,160);\" onKeyUp=\"limitText2(this,160);\" style=\"resize:none;\"></textarea> <span id=\"commenterr\" style=\"font-weight:bold; font-size:90%;\"></span> <br style=\"line-height:190%;\"> <button id=\"comment_btn\" class=\"ui-btn ui-btn-inline\" style=\"border: #ffffff 1px solid;\">Enter your comment</button> </center> <a href=\"#searchpage\" data-transition=\"slide\"> Back </a>";

$(document).ready(function(){
  $("#comment_btn").click(function(){ //click write_comment a tag btn
  console.log ("ready-comment_btn: clicked comment_btn");
    $.post("cgi-bin/s_comment.pl", {
        comment:"HELLO WORLD IN READY",
    },
    function(data,status){
      document.getElementById('div_comment').innerHTML = data;
    });
  }); //write_comment
}); //ready

$(document).on("click","#comment_btn",function(){ //click write_comment a tag btn
  console.log ("ready-comment_btn: clicked comment_btn");
    $.post("cgi-bin/s_comment.pl", {
        comment:"HELLO WORLD IN READY",
    },
    function(data,status){
      document.getElementById('div_comment').innerHTML = data;
    });
  }); 

$("body").on("click", "#comment_btn", function(){ ... });