当前位置: 代码迷 >> ASP.NET >> Jquery互动对话框是如何实现的
  详细解决方案

Jquery互动对话框是如何实现的

热度:6766   发布时间:2013-02-25 00:00:00.0
Jquery互动对话框是怎么实现的

类似这种弹出的对话框,登录后跳转,对话框返回值等。是怎么实现 的
是采用哪种插件呢。

------解决方案--------------------------------------------------------
用jquery ui中的dialog他已经封装的很强大了,看下api大多数功能都有的
你要的大概就是如下效果吧
HTML code
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %><asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server"></asp:Content><asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">    <input type="button" id="testDialog" name="testDialog" onclick="javascript:$('#dialog').dialog('open');"        value="测试Dialog" />    <div id="dialog" title="Dialog Title">        <table style="width: 90%;">            <tr>                <th colspan="2">                    <strong>基本信息</strong>                </th>            </tr>            <tr>                <td style="width: 30%;">                    <strong>登陆账号:</strong>                </td>                <td style="width: 70%;">                    <input id="account" name="account" value="" />                </td>            </tr>            <tr>                <td style="width: 30%;">                    <strong>密码:</strong>                </td>                <td style="width: 70%;">                    <input id="password" name="password" value="" />                </td>            </tr>        </table>        <%--        <input type="text" name="modifyValue" id="modifyValue" value="" />--%>    </div>    <script language="javascript" type="text/javascript">        var InitDialog = function () {            $('#dialog').dialog({                autoOpen: false,                width: 600,                title: "用户登陆",                buttons: {                    "Ok": function () {                        //触发你的jquery form验证通过进行下一步,关闭dialog                        $(this).dialog("close");                    },                    "Cancel": function () {                        $(this).dialog("close");                    }                }            });        }        //创建dialog对象表示初始化,等同于在$().ready(function(){})里调用        var initDialog = new InitDialog();    </script></asp:Content>
  相关解决方案