lhgDialog这个工具

    现在我们在做一个项目,我担任小组长,责任重大啊!今天看了一下lhgDialog这个弹窗的js,很强大啊!决定要好好研究研究。

废话不多说了,上代码吧!

先创建一个父窗体,在里面引入js的类库

  <link href="../lhgdialog/_doc/common.css" rel="stylesheet" type="text/css" />
     <script src="../lhgdialog/lhgdialog/lhgdialog.js" type="text/javascript"></script>
     <script src="../lhgdialog/lhgdialog/lhgdialog.min.js" type="text/javascript"></script>
     <script src="../lhgdialog/lhgdialog/lhgcore.lhgdialog.min.js" type="text/javascript"></script>

 1 <script language="javascript" type="text/javascript">

 2 // <![CDATA[

 3 

 4         function Button1_onclick() {

 5             $.dialog({ content: 'url:WebForm2.aspx' });

 6         }

 7         function add_row() {

 8 

 9         }

10         function del_row(tr) {

11             if (tr.parentNode.parentNode.id != 'mb')

12                 tr.parentNode.parentNode.parentNode.removeChild(tr.parentNode.parentNode);

13         }

14         function Button2_onclick() {

15             var trmb = document.getElementById('mb');

16             var hi = document.getElementById('txt2').value;

17             var lbl1 = document.getElementById('lbl1');

18             lbl1.innerHTML = hi;

19             var lbl2 = document.getElementById('lbl2');

20             var mydate = new Date();

21             lbl2.innerHTML = mydate.toLocaleDateString();

22             var ntr = trmb.cloneNode(true);

23             ntr.id = '';

24             trmb.parentNode.appendChild(ntr);

25         }

26 

27 // ]]>

28     </script>

 

内容是:

<body>

    <form id="form1" runat="server">

    <div>

        <input id="Button1" type="button" value="button" onclick="return Button1_onclick()" />

        <input id="txt2" type="hidden" />

        <input id="Button2" type="button" value="button" onclick="return Button2_onclick()" />

        <table style="width: 100%;">

            <tr id="mb">

                <td>

                   <label id="lbl1"></label>

                </td>

                <td>

                    <label id="lbl2"></label>

                </td>

            </tr>

        </table>

    </div>

    </form>

</body>

再就创建一个子页面

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

    <style type="text/css">

body{margin:0;padding:0;}

input{font-size:12px;margin:0;padding:2px;}

    </style>

    <script type="text/javascript">

        var api = frameElement.api, W = api.opener;



        api.button({

            id: 'valueOk',

            name: '确定',

            callback: ok

        });



        function ok() {

            W.document.getElementById('txt2').value = document.getElementById('itxt').value;

            W.Button2_onclick();

        };

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

<p style="color:#F00;text-align:center;margin-top:40px;"><input size="25" id="itxt" type="text" value="窗口内容页中文本框的值"/></p>

<p style="text-align:center;">点击下面的确定按钮将值传回调用组件页面的文本框中</p>

    </div>

    </form>

</body>

</html>

就OK了。今天一个大的难题就解决了啊  不错啊!他还存在一个问题就是第一次插入的时候要插入两次

你可能感兴趣的:(dialog)