0

这个网站在编写这个程序时真的很有帮助。不幸的是，我在某个时候遇到了障碍，并且从那以后将问题归结为很多。此时，我正在查看三个文件，一个包含表单的 .html、一个包含我的事件处理程序的 .js 以及一个接收我的帖子变量并包含表单的新内容的 .php。

我从初始文本输入中获取帖子数据就好了。新的表单内容按照我的预期设置。但是，在将此表单内容设置为带有按钮类的按钮类型的新输入之后，我的按钮类处理程序中的 post 方法没有像我期望的那样在 login.php 上设置 post 数据。

这是我的代码：

interface.html页面内容：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<form id="interface" action="login.php" method="post">
<input type="text" value="enter username here" name="user"/>
<button id="submit">submit</button>
</form>
<script src='events.js'></script>
</body>
</html>

events.js 文件的内容：

$("#submit").click(function(){
  $.post(
    $("#interface").attr("action"),
    $(":input").serialize(),
    function(info){$("#interface").html(info);}
  );
}); 
$(".button").click(function(){
  var $this=$(this);
  $.post(
    $("#interface").attr("action"),
    {data:$this.val()},
    function(info){$("#interface").html(info);}
  );
}); 
$("#interface").submit(function(){
  return false;
});

login.php 文件的内容：

<?php
if(isset($_POST['user'])){
  echo '<input type="button" class="button" value="set data"/>';
}else if(isset($_POST['data'])){
  echo 'data is set';
}
?>
4

1 回答 1

0

您需要等到按钮存在才能将事件绑定到它。此外，我会从点击切换到提交并将点击事件绑定完全放在 .button 上。

//$("#submit").click(function () {
$("#interface").submit(function (e) {
    e.preventDefault();
    var $form = $(this), data = $form.serialize();
    if ($form.find(".button").length && $form.find(".button").val() ) {
        data = {data: $form.find(".button").val()};
    }
    $.post($form.attr("action"), data, function (info) {
        $form.html(info);
    });
});

//$("#interface").submit(function () {
//    return false;
//});

由于表单没有被替换，并且事件在表单上，​​您不再需要重新绑定任何内容。

于 2013-10-29T20:54:04.413 回答