lhgDialog这个工具

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

废话不多说了，上代码吧！

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

 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了。今天一个大的难题就解决了啊不错啊！他还存在一个问题就是第一次插入的时候要插入两次

posted @ 2012-11-29 11:14 九妹阅读(429) 评论(0) 编辑收藏举报

刷新页面返回顶部

九妹

lhgDialog这个工具

公告