使用jQuery弹出？答案

【问题标题】：Popup using jQuery?使用jQuery弹出？
【发布时间】：2009-10-05 11:49:42
【问题描述】：

我相信，我正在尝试做一件非常简单的事情。在用户单击将某人添加到他的朋友列表后，我需要弹出一个成功确认对话框。只需在页面上有一个带有 url (mysite.com/add/friendname) 的添加链接。我需要异步发出这个请求，所以我使用 jQuery.ajax 内置函数来发送请求。看看下面的代码：

$(document).ready(function() {
    $('.track_links').click(function() {
        if (confirm("are you sure you want to track <firstname lastname>?")) {
            $.ajax({ 
                type: "GET",
                url: this.href,
                success: function() {
                alert("Congratulation! you're now tracking <firstname lastname>");
                },
                error: function() {
                    alert("Oops! An error occured, plz try again later!");
                }

            });
            return false;
        }
        else {         
            return false;
        }
    });
});

现在，简而言之，这就是我需要做的事情：
1- 我需要使用已经设计好的 Html 表单作为成功或失败确认消息，而不仅仅是警报！
2-我还需要用实际用户名（名字空间姓氏）替换该html页面上的占位符（###username###），这是文档中另一个字段的值。在客户端弹出它之前如何操作这个html？

p.s：我的 Html/Javascript 技能非常棒；）（好吧，不是真的）！

【问题讨论】：

标签： javascript jquery html asp.net-mvc

【解决方案1】：

第一部分

你可以使用

show

在ajax成功函数中显示一个div的函数。

$("#divResult").show();

如果 divResult 是要显示的 div 的 id

第二部分

您可以使用获取名字和姓氏的值

$("#txtFirstname" ).val();

和

$("#txtLastname" ).val();

如果您的名字文本框 id 是 txtFirstname 并且姓氏文本框 id 是 txtLastName

【讨论】：

那么，您假设要显示的这个 divResult 已经注入到原始文档中？如果我希望它的内容来自动态服务器资源怎么办？例如我需要弹出内容来自将所需 html 作为 ContentResult 返回的操作方法。
然后你可以使用 html() 方法分配内容。

【解决方案2】：

这就是我设置确认对话框的方式，它可以快速修改为对像您这样的操作的确认。 http://professionalaspnet.com/archive/2009/06/02/Displaying-a-Confirmation-Dialog-with-the-JQuery-UI-Dialog.aspx

【讨论】：

【解决方案3】：

对于表单，我建议使用html() 方法，它会注入您必须提供的原始 HTML。既然已经有了，可以通过参数把它交给Method。

对于占位符部分，我建议使用val() 方法，再加上Javascript 的built-in regex functions。

如果您的占位符是“###firstname###”，那么您应该尝试类似

var firstname = jQuery('input#firstname').val();
var lastname = jQuery('input#lastname').val();
var text = jQuery('span#ThePlaceMyPlaceholderIsAt').text();
text = text.replace(/\#\#\#firstname\#\#\#/,firstname);
text = text.replace(/\#\#\#lastname\#\#\#/,lastname);
jQuery('span#ThePlaceMyPlaceholderIsAt').text(text);

【讨论】：