一：前言

　　　　　最近在使用jquery的控件，其实以前也写但是突然之间遇到了需要从弹出窗口传值到父窗口，突然觉得这种传值的方式其实也是需要javascript的基础的，但是我自己还没有去真正的做过，所以还是先记载下吧。

　　二：内容　　

　　　　先说说有关lhgdialog.js和lhgcore.lhgdialog.min.js、lhgdialog.min.js

　　　　lhgdialog.min.js：是lhgdialog.js的压缩版，所谓压缩版就是将javascript的代码进行去空格、换行、去注解、简化不对外开放的变量名称等等手段达到不修改原代码的功能而减少文件的大小。所以在调试阶段使用压缩版，而在正式版部署时使用压缩版。

　　　　lhgcore.lhgdialog.min.js:在导入js时需要先导入该js,因为lhgdialog.js里面有用到该js中的代码，如果你的框架中有jquery.js那么可以不导入lhgcore.lhgdialog.min.js，我先说说我自己用的效果，我在网页中导入了lhgcore.lhgdialog.min.js和lhgdialog.js，效果是弹出的窗体无法改变样式就是窗体颜色，但是我导入jquery.js和lhgdialog.js就可以改变样式，这可能就是兼容性问题

窗口lhgdialog.min.js文件的url参数
参数形式为：<script type="text/javascript" src="lhgdialog.min.js?self=true&skin=chrome"></script>
self：指定弹出窗口的页面
类型：String
默认：'false'
说明：此参数只用在框架页面中，如果不写此参数或值为false时则窗口跨框架弹出在框架最顶层页面，如果值为true则不跨框架，而在当前面页弹出。
skin：多皮肤共享CSS文件名
类型：String
默认：'default'
说明：不写此参数则值为default。如果你想在同一页面使用不同皮肤的窗口，此处的值就为多皮肤共存的CSS的文件名
url参数不需要设定的就可以不写，不写时就使用默认值。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>

        <meta http-equiv="Content-type" content="text/html;charset=GB2312" >

            <script type="text/javascript" src="jquery-1.9.1.js"></script>

            <script type="text/javascript" src="lhgdialog.js?self=true&skin=igreen"></script>

            <script type="text/javascript">

            $(document).ready(function(){

            $(".printbutton").bind("click",function(){

                $.dialog({title:'第一次lhgdialog.js的测试！！！'});

            });

            });

            </script>

        </meta>

    </head>

    <body>

        <input type="button" value="测试" class="printbutton">

    </body>

</html>

　　　先上js代码看看

$("#chooseGoods").click(function(){

                var arrs = new Array();

                $("input[class='xh']").each(function(){

                    arrs.push($(this).val());

                });

                $.dialog({

                    title:"选择商品",data:{"arrs":arrs},ok:function(){

                        var result = "";

                        var arrays = null;

                        var count = 0;

                        $("input[type='checkbox']:checked",this.content.document).each(function(index){

                            if($(this).attr("id") != 'checkAll')

                            count++;

                        });

                        if(count == 0){

                            $.dialog.alert('没有选中记录，请选择',function(){},$dialogParent());

                            return false;

                        }

                        $("input[type='checkbox']:checked",this.content.document).each(function(index){

                            //动态给页面赋值

                            if($(this).attr("id") != 'checkAll'){

                               　　 result =  $(this).attr("returnvalue");//找到父窗口中的这个returnvalue

                              　　  arrays = result.split("##");

　　　　　　　　　　　　　　　　　　　　　　//$(this).parent()指td,$(this).parent().parent()指的就是tr,这里找得就是这一行的第三列

　　　　　　　　　　　　　　　　　　　　　　var jqmc=$(this).parent().parent().find("td:eq(3)").text();

                　　　　　　　　　　　　var a = $.grep(arrs,function(n,i){

　　　　　　　　　　　　　　　　　　　　　　return n==arrays[0];//返回值相等的结果

　　　　　　　　　　});

                                if($.type(a)=='undefined' || a==''){

                                    addsj(arrays[0],arrays[1],arrays[2],arrays[3],jqmc,arrays[5],arrays[6]);

                                }

                            }

                        });

                    },

                    content: "url:${base }/goods/goods_checkList.action",

                    width: "1000px",height: "500px",

                    lock:true,

                    parent:$dialogParent()

                });

            });

        });

grep的用法可以看如下：

http://www.jquery001.com/jquery-grep-function.html；

http://www.css88.com/archives/2472的介绍

在父窗口中显示有段这样的js用来判断已经选择的数据（比如说当你选了一次，发现选少了或者选错了时，再点一次的时候父窗口需要把你已经选择的选中）

jquery属性介绍：http://blog.csdn.net/mayanling0113/article/details/7403149

    //页面加载初始化

        $(document).ready(function () {

            var api = frameElement.api;//这个事获取界面的对象

            if(api.data.arrs!=null){//获取子窗口的值

                for(var i=0;i<api.data.arrs.length;i++){

                    $("input[type='checkbox'][value='"+api.data.arrs[i]+"']").attr("checked", true);

                }

            }

        });
<td align="center"><input type="checkbox" value="${goods.Id}"  id="${goods.zfId}" return_value="${goods.Id}##${goods.Bh}##${goods.mc}##${goods.lx}##${goods.sl}##${goods.jg}##${goods.dz}" name="checkBoxname" /></td>

小知识点：

　　有关parent和parents的区别

　　　　parent：可以说是当前对象的父元素。比如说<td><input type="text" name="输入"></td>，在这里：$(:text).parent()的父元素就是<td></td>

　　　　parents:可以说就是你的家族只要是你这一代的祖辈都是，可以看出找这些就是看该元素在那个包围圈内。

　　　　这里有个链接可以直接去学习下，将的很详细了。我自己也是试验了一遍，觉得很好：

　　　　http://blog.csdn.net/cui_angel/article/details/7903704

三：总结

　　最近是自己在试着来试验这些前端的框架。觉得动手做还是不一样，有很多问题自己做了才知道的。努力！本来说要离开的，结果经理又让我留下来了，我自己也不知道是留是走，其实很矛盾的。因为我现在还是觉得可以学到很多东西的。知识在一点点的增长，现在才觉得自己还是经验不够啊。所以我自己可能还是决定。。。待定状态啊。

　　开始行动就是从这个弹出框开始试验，决定用spring mvc来搭建框架做，用MyBatis来连接数据库。一步步来试验了。准备开始。Go!

　　　　　　　　

jquery中lhgdialog插件（一）的更多相关文章

  1. jQuery中开发插件的两种方式

    jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...

  2. jQuery中的插件的编写和使用

    1,常用的jQuery插件:表单验证插件formValidator a.目前支持5大验证方式:1.inputValidator(针对input,textarea,select控件的字符长度,值范围,选 ...

  3. Jquery中日期插件jquery.datepick的使用

    jsp的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageE ...

  4. jQuery中开发插件的两种方式(附Demo)

    做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数是属于jQuery命名空间的函数),如果将jQu ...

  5. jquery中validate插件表单验证

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  6. jquery中的插件EChars的使用

    首先,进入EChars的官网下载页面:http://echarts.baidu.com/download.html    下载自己需要的版本. 引入jquery包和echars,进入官网的实例:htt ...

  7. jQuery中的each, data, 插件

    一.  each() $(' ').each(function (){...}) jQuery.each(collection, callback(indexInArray, valueOfEleme ...

  8. jQuery中的工具和插件

    jQuery的工具属性 jQuery类数组操作 length属性 表示获取类数组中元素的个数 get()方法 表示获取类数组中单个元素"括号中填写该元素的索引值" index()方 ...

  9. Jquery中的日历插件

    这个插件很简单:只需要在HTML代码中引入插件如下,CLASS名和click事件函数固定! <!doctype html> <html lang="en"> ...

随机推荐

  1. LINUX系统配置相关

    修改系统引导文件 grub.cfg的文件位置   /boot/grub/grub.cfg set default="4"  默认windows是在第四个选项 set timeout ...

  2. elasticsearch-mathc和term的区分

    elasticsearch和mysql在思想上是有不同的,elasticsearch有分词一说,比如北京奥运分词成北京,奥运,北京奥运.分词要要考虑两点,一个是查询字符串要不要分词,还有就是原存储字段 ...

  3. 用express搭建一个简单的博客系统

    转自:https://blog.csdn.net/qq_29721837/article/details/62055603 Express 简介 Express 是一个简洁而灵活的 node.js W ...

  4. 小程序开发时PC端调试返回结果和手机端IOS不一致问题

    IOS11登录时遇到一个请求与PC返回不一致情况, 在小程序调试时IOS上始终没有wx.request() 不能发送请求 尝试解决方法 打开微信小程序调试的设置, 将TLS设为可信任的域名 设置 -- ...

  5. CE-HTML简介

    1.典型的CE-HTML代码如下: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html ...

  6. neutron DVR

    DVR 简介 DVR 提出的背景 在 Neutron 的网络环境中,跨子网的虚机通信是需要通过 Neutron 的路由器.这既包括不同子网的虚拟机之间的通信,又包括虚拟机与外网之间的通信.在 DVR ...

  7. PhoneGap & HTML5 学习资料网址

    PhoneGap 与 Application Cache应用缓存  http://www.html5cn.org/forum.php?mod=viewthread&tid=40272 加速We ...

  8. vue2.0介绍

    1.vue.js 是什么 vue(view)是一套构建用户界面的渐进式框架 Vue (pronounced /vjuː/, like view) is a progressive framework  ...

  9. (转)Loadrunner监控Linux的17个指标

    1.Average load:Average number of processes simultaneously in Ready state during the last minute.   上 ...

  10. about !dbgprint to analyze BSOD dump file.

    基本规则: 只有debug mode enable的机器,产生的dump file才会保存dbgprint的buffer. 默认!dbgprint的buffer size是4k. 增加buffer s ...