Javascript 使用jquery/ajax在另一个colorbox上使用colorbox

我有一个页面，其中我正在使用id为=“emailfrnd”的a，我成功地从以下脚本实现了colorbox：

<script type="text/javascript">
$(document).ready(function(){
$("#emailfrnd").colorbox({
        inline: true,
        href:"#ef",
        close:"",
    opacity:0.95,
        onClosed:function(){
            //window.parent.location.reload(true);
        }
         });
 });
</script>

$（文档）.ready（函数（）{
$（“#emailfrnd”）.colorbox({
是的，
href:“ef”，
关闭：“，
不透明度：0.95，
onClosed:function（）{
//window.parent.location.reload（true）；
}
});
});

现在，新的colorbox包含一个表单，其中有一个id为“emailfrnd_submit”的发送按钮。现在，我已经使用jquery和ajax编写了一些验证，如果没有错误消息，我将获得另一个colorbox，代码如下：

if (errorMessage == '') {
    $.ajax({
        type: 'POST',
        url: root_url + '/services/services.php?method=emailfrnd',
        data: "name=" + name + "&email=" + email + "&message=" + message,
        async: true,
        success: function (data) {
            if (data == 1) {
                $("#emailfrnd_submit").colorbox({
                    inline: false,
                    close: "",
                    html: "<div style='height:230px;width:400px;display:block;'><p style='color:black;font:16px verdana;'>Your email was successfully sent.</p><br/><p style='color:gray; font:16px verdana;'>Thank you for telling your friend</p><div id='emailfrnd_sub' style='width: 50px;margin-top:30px;float: right;'><input type='submit' value='OK' name='emailfrnd_submit' id='emailfrnd_sub' class='redbut' style='float:right;position:absolute;right: 198px;margin-top: 0px;color:white;'></div></div>",
                    opacity: 0.95,
                    onClosed: function () {
                        //window.parent.location.reload(true);
                    }
                });
                //window.location.assign("../index.php");
            } else {
                alert('mail not send');
            }
        }
    });
} else {
    alert(errorMessage);
}
});

if（errorMessage==''）{
$.ajax({
键入：“POST”，
url:root_url+'/services/services.php？method=emailfrnd'，
数据：“name=“+name+”&email=“+email+”&message=“+message，
async:true，
成功：功能（数据）{
如果（数据==1）{
$（“#emailfrnd_submit”）.colorbox({
内联：错，
关闭：“，
html:“
谢谢您告诉您的朋友，
不透明度：0.95，
onClosed:function（）{
//window.parent.location.reload（true）；
}
});
//window.location.assign（“../index.php”）；
}否则{
警报（“邮件未发送”）；
}
}
});
}否则{
警报（错误消息）；
}
});

到目前为止，我成功地得到了我想要的东西，在做了验证之后，再次点击发送按钮，根据这段代码，一个新的带有html内容的颜色框即将出现，这里我有一个Ok按钮，我想把这个按钮作为这个颜色框的关闭按钮。我如何在这里获得ok按钮的功能？？

---

非常感谢任何人的帮助…提前感谢….

您不需要两个色盒即可完成此操作
为什么不简单地创建一个

div

哪个类是

message\u content

，然后根据ajax状态更新它的文本？
好多了

示例：

/**
 * Close message
 */
jQuery('#colorbox_content').on('click', '.close', function() {
    jQuery(this).closest('#message_content').slideUp();
});

/**
 * On form submit
 */
if (errorMessage == '') {
    $.ajax({
        type: 'POST',
        url: root_url + '/services/services.php?method=emailfrnd',
        data: "name=" + name + "&email=" + email + "&message=" + message,
        async: true,
        success: function (data) {
            if (data == 1) {
                var message = "Your email was successfully sent.";
                //window.location.assign("../index.php");
            } else {
                var message = "Your email was successfully sent.";
            }
            jQuery('#colorbox_content').slideDown().find('.message').text(message);
        }
    });
} else {
    alert(errorMessage);
}

html：

<div id="colorbox_content"> //@todo: change to colorbox id

    <form id="your_form">   //@todo: change according to your form id

    </form>

    <div class="message_content">

        <p class="message"></p>
        <span class="close"><a href="javascript:void(0);">Close</a></span>

    </div>

</div>

根据评论更新：

如果希望不同按钮具有相同的功能性，则必须对它们使用相同的

类。
这是您需要的。


我将一些
id
更改为
classes
，因此不需要使用相同代码的两个事件

这是我的建议。

您可以看到，您可以存储每种颜色盒的
选项，然后通过参数传递它们。
我得到了答案，fiddile显示了如何执行此操作……：：；；；）；）
没有人能帮我解决这个问题？？为什么有两个色盒？只需使用一个，div“status”字段表示提交已完成或失败。然后用退出按钮替换提交按钮。那么，你知道怎么做了，太好了。但这不是最好的方法，如果你看看我更新的答案，你会发现它可以更好。