Question

我正在使用Dialog Widget在index.php中使用此代码生成弹出窗口：

<button class="btn btn btn-info openObs">Deixar observação</button>
<div id="dialog" title="Dialog Title">I'm a dialog</div>

和

$("#dialog").dialog({ autoOpen: false });
        $(".openObs").click(function() {
          $("#dialog").dialog("open");
});

到目前为止没有问题，但我有一个ajax代码，为我生成其他存档中的表中的这个按钮，并将结果回显到我的index.php中的结果div：

 $return .= "$tabela";

  while($row = mysqli_fetch_assoc($query)){
            $data = str_replace('-', '/', $row['consulta_data']);
                  $data =  date('d/m/Y', strtotime($data));
            $return .= "<tr>";
            $return .= "<td>" .$row['consulta_idConsulta']."</td>";
            $id = $row['documento_id'];
            $return .= "<td>" .$data. "</td>";
            $return .= "<td>" .$row['consulta_hora']. "</td>";
            $return .= "<td>" .$row['consulta_desc']. "</td>";
            $return .= "<td>" .$row['profissional_nome']. "</td>";
            $return .= "<td>" . "<button class=\"btn btn btn-info openObs\">Deixar observação</button></td>";
            $return .= "</tr>";

          }

          echo $return .=" </tbody>
              </table>";

问题是，当我点击ajax生成的按钮时没有任何反应，但如果我手动按下按钮就可以正常工作了。

Answer 1

问题是该按钮已生成。为避免这种情况，您需要使用on（） http://api.jquery.com/on/

$(body).on('click', '.openObs', function(){

});

以下是js.fiddle。您可以通过启用和禁用单个功能来测试它。

确保$（body）不是稍后附加的元素。所以它可以是$（'。container'），只要它不是javascript生成的。

Answer 2

你的情况下的问题是，当你绑定click对话框的功能时，你用ajax创建的按钮还没有出现在DOM中，因此在你的绑定之后不会对ajax创建的按钮进行绑定。要实现此功能，一种简单的方法是在使用ajax创建按钮后再次绑定相同的函数。这将解决问题。

使用Ajax和Dialog Widget

2 个答案: