1

我有一个多页文档,但我一直在显示 html 并对一个 php 文件中的单个页面进行验证:

<div id="checkPage" data-role="page">
  <div data-role="header">
    <h1>Page Title</h1>
  </div>
  <div data-role="content">
    <?php
    $form = $_REQUEST['form'];  //this is simply a hidden input in my form that I reference to know if a form submission has occurred
    if($form) {
      $res = process();
      if(is_array($res)) { //if the data is an array then it is an array of errors that I will display to the user
        $html = page($res); 
      } else {
        $html = $res;  //if the data is not an array then it is confirmation html that the request was successful.
      }
    } else {
      $html = page();
    }
    echo $html;
    ?>
  </div>
</div>

在我的 page() 函数中,我在我的 HTML 之后附加了一些 jquery:

$detail .= chr(10) . '<script type="text/javascript">';
$detail .= chr(10) . '$( "#checkPage" ).bind( "pageinit",function(event){';
$detail .= chr(10) . '  $("#txtAmount").change(function(){';
$detail .= chr(10) . '    alert("INSIDE");';
$detail .= chr(10) . '  });';
$detail .= chr(10) . '});';
$detail .= chr(10) . '</script>';
return $detail;

当我导航到我的页面然后输入(并离开)金额文本框时,我看到了警报。如果我单击页面上的取消按钮(我被重定向到另一个页面)然后通过菜单超链接再次返回并再次输入(并离开)文本框,我也会看到警报。但是,如果我提交表单,发现验证错误并重新显示页面,则不会再次设置 pageinit。即使我离开 pageinit 逻辑,也不再设置更改事件。

我究竟做错了什么?我很感激我能得到的任何帮助。

4

2 回答 2

2

当你修改 DOM 时,你实际上得到了一组全新的元素。绑定到被替换元素的事件消失了,因为原始 DOM 元素不再存在。请参阅 jQuery 常见问题解答

http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_AJAX_request.3F

您可以使用 jQuery.live 绑定到现在和将来匹配的元素。

http://api.jquery.com/live/

或者,您可以将绑定逻辑放在一个通用函数中,并在 Ajax 成功后调用它,如此处所述

http://jetlogs.org/2009/01/29/re-binding-jquery-events-on-ajax-callbacks/

于 2012-06-06T17:45:53.133 回答
0

这是最终奏效的方法。Eric J. 确实让我走上了正轨。

$detail .= chr(10) . '<script type="text/javascript">';
$detail .= chr(10) . '$("#txtAmount").die("change");';
$detail .= chr(10) . '$( "#txtAmount" ).live( "change",function(event){';
$detail .= chr(10) . '  alert("CHANGE");';
$detail .= chr(10) . '});';
$detail .= chr(10) . '</script>';

如果没有骰子,那么如果我离开并返回,它将被多次调用。但是如果没有 live 它在表单提交后将无法工作。

于 2012-06-06T23:36:01.653 回答