Jquery cfml - 没有一个脚本是可执行的

Question

我有一个包含 CFdiv 的 CF 页面。 Cfdiv 绑定(bind)到页面上的元素。主页包含脚本。没有脚本对 CFdiv 中的元素执行。看来ajax调用有问题。当我取出该代码时，其余代码似乎在 Firebug 中启用，但仍然不会执行。

<script type="text/javascript">
  $(document).ready(function () {
    $('#candidatesubmit').on('click', function () {
      $.ajax({
      type: 'POST',
      url: 'actEditStatusForm.cfm',
      data: 'form=',
      error: function (xhr, textStatus, errorThrown)(
      // show error 
      alert(errorThrown);),
      success: function (response1, textStatus, jqXHR)(
      alert('success');)
       });
    ColdFusion.Grid.refresh('candidatesGrid', true);
  });
  $(function () {$("#JDOrgChartRESOutlineSentToCand").datepicker({dateFormat: 'yy/mm/dd'});});
  $(function () {$("#IndepthWRec").datepicker({dateFormat: 'yy/mm/dd'});});
</script>

Answer 1

首先，您有一些语法错误。也许这只是上面粘贴的问题，而不是您真实代码中的问题。但请确保错误和成功函数的主体用大括号而不是括号括起来。

所以代替这个:

error: function (xhr, textStatus, errorThrown)(
  alert(errorThrown);),

你应该有这个:

error: function (xhr, textStatus, errorThrown) {
  alert(errorThrown);
},

其次，网格刷新超出了 ajax 调用的成功函数范围。由于该调用是异步的，因此网格刷新可能会在该调用完成之前运行。将刷新移动到成功回调函数中，如下所示:

success: function (response1, textStatus, jqXHR){
  ColdFusion.Grid.refresh('candidatesGrid', true);
  alert('success');
}

第三，如果 cfdiv 的内容是异步加载的，并且 #candidatesubmit 元素位于动态加载的内容内，则您的函数将不会绑定(bind)到其 click 事件，因为当触发主页的 ready 事件时，该事件不会出现。

因此，不要直接绑定(bind)到元素，而是通过监听您知道将出现在初始页面加载中的封闭元素上的事件来使用委托(delegate)策略。所以代替这个:

$('#candidatesubmit').on('click', function () {

尝试这样的事情:

$('#some_outer_div').on('click','#candidatesubmit', function () {

#some_outer_div 现在将监听从其后代元素冒出的任何点击事件(甚至是那些在页面首次加载时不存在的点击事件)。如果其中一次点击的目标是 #candidatesubmit，则处理程序将触发。