Question

我在使用FancyBox插件时遇到问题。我正在尝试使用Ajax提交一个表单，只打印一个很好的小成功消息，还没有验证，试图让它工作。我可以使用jQuery提交并显示FancyBox中任何输入的值。但是，当我尝试执行Ajax时，它只关闭了FancyBox。我不是专家......

FancyBox的内容是使用Ajax生成的，因为它需要来自数据库的数据。

以下是重要的代码部分:(文本是德语......）

使用Ajax加载到FancyBox中的文件

    <script>
            $("#submit").click(function() {

                var login = $("#login").val();

                $.ajax({
                       type: "POST",
                       url: "handleuseredit.php",
                       cache: false,
                       data: { login:   login },
                       success: function(data){
                       if(data=='ok')
                       {
                            alert('Richtig.');
                       }
                       else
                       {
                            alert('Falsche Benutzername/Passwort Kombination.');
                       }
                    }
                });     
            });
    </script>
        <div class="login">
            <div class="widget_header">
                <h4 class="widget_header_title wwIcon i_16_wysiwyg">Benutzer Bearbeiten</h4>
            </div>
            <div class="widget_contents lgNoPadding">
            <form method="post" id="form-edit">
                <p id="errormessagehere"></p>
                <div class="line_grid">
                    <div class="g_3 g_3M"><span class="label">Benutzername</span></div>
                    <div class="g_9 g_9M">
                        <input type="text" name="login" id="login" value="<?php echo getusername($_GET['u']) ?>" class="simple_field tooltip" placeholder="Benutzername" autocomplete="off"></div>
                    <div class="clear"></div>
                </div>
                <div class="line_grid">
                    <div class="g_3 g_3M"><span class="label">Passwort</span></div>
                    <div class="g_9 g_9M">
                        ********
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="line_grid">
                    <div class="g_6"><a href="" id="submit">Abschicken</a>
                    </div>
                    <div class="clear"></div>
                </div>
                </form>
            </div>
        </div>

以下是我如何称之为花式框

$(document).ready(function() {

            $(".fancybox").fancybox({

                'scrolling'     : 'no',
                'padding'       : 0,
                'titleShow'     : false

            });

         });

handleuseredit.php只是回应“确定”以满足数据变量要求。

Answer 1

您可以使用fancybox的版本2（http://fancyapps.com/fancybox/）测试类似的内容：

<script>
            $("#submit").click(function() {

                var login = $("#login").val();

                $.ajax({
                       type: "POST",
                       url: "handleuseredit.php",
                       cache: false,
                       data: { login:   login },
                       success: function(data){
                       if(data=='ok')
                       {
                         $.fancybox( '<h1>Richtig.</h1>' );
                       }
                       else
                       {
                         $.fancybox( '<h1>Falsche Benutzername/Passwort Kombination.</h1>' );
                       }
                    }
                });     
            });
    </script>

如何在Ajax生成的FancyBox中执行Ajax？

1 个答案: