Question

我有一个表单显示在一个id为“mcform”的jQuery FancyBox div中。单击按钮时，我调用此函数：

function postit() {
  $.ajax({
    type: "POST",
    url: 'listSubscribe.php',
    data: "fname=" + $("#fname").val() + "&lname=" + $("#lname").val() 
      + "&email=" + $("#email").val(),
     success: function(msg) {
        $('#mcform').html(msg);
        $("#fname").val('');
        $("#lname").val('');
        $("#email").val('');
    }
  });   
}

我可以在控制台中看到listSubscribe.php给出一个200头并返回文本。但是，除了值擦除外，表单不会更改。但是，如果我关闭FancyBox并重新打开它，看看listSubscribe.php返回的文本是否按预期替换了表单的html。

任何人都知道会导致这种情况的原因是什么？我假设我正在与FancyBox战斗，但我不知道该怎么做。

Page在这里：http://dominiquesonmag.com/new.html

感谢阅读！

Answer 1

这有效

function postit() {
 $.ajax({
   type: "POST",
   url: 'listSubscribe.php',
   data: $("#mcform form").serialize(),
   success: function(msg) {
       $('#fancy_content').children().children().html(msg);
        $("#fname").val('');
        $("#lname").val('');
        $("#email").val('');
   }
 });   
}

因为您通过id引用mcform，它只是在找到的第一个元素上设置值，而是将其更改为类mcformclass并尝试$('.mcformclass').html(msg);，这应该更改mcform的两个实例上的值。

Answer 2

查看该页面，我注意到邮件芯片DIV中还有另一个ID ='mcform'的DIV。这可能会导致问题，因为它试图将HTML设置为不同的DIV。

另外，有几个提示：使用serialize（）创建数据字符串，您可以选择表单中的所有输入元素将其值设置为空字符串：

function postit() {
 $.ajax({
   type: "POST",
   url: 'listSubscribe.php',
   data: $("#mcform form").serialize(),
   success: function(msg) {
       $('#mcform').html(msg);
       $("#mcform input").val('');
   }
 });   
}

fancybox div中的内容更改仅在关闭和重新打开后显示

2 个答案: