一:前言

     最近在使用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. 基于Ubuntu Server 16.04 LTS版本安装和部署Django之(三):设置上传文件夹权限(这里测试用完全共享)

    基于Ubuntu Server 16.04 LTS版本安装和部署Django之(一):安装Python3-pip和Django 基于Ubuntu Server 16.04 LTS版本安装和部署Djan ...

  2. Android开发——View绘制过程源码解析(二)

    0. 前言   View的绘制流程从ViewRoot的performTraversals开始,经过measure,layout,draw三个流程,之后就可以在屏幕上看到View了.上一篇已经介绍了Vi ...

  3. 一个关于sql更新的小笔记

    一直在sqlserver下写东西,突然用mysql有些语法发生了改变,有点折腾 (MS SQL Server)语句:update A set  a.Name =   b.Name   from   A ...

  4. Win7系统下删除文件时出现“正在准备再循环”的解决方法

    今天,笔者在备份文件的时候,将一个word文档从移动硬盘复制到桌面.经过一系列“复(meng)杂(bi)”的操作之后,笔者突然发现,文件无法删除了.当右键文件点击“删除”时,出现对话框显示“正在准备 ...

  5. Z.XML第一次迭代分数分配

    紧张的第一次迭代落下帷幕,便到了分数分配这样令人揪心又无奈的日子.如何进行分数分配,以使大家都能满意,这一直是个难以非常好地处理的问题.幸运地是,我们团队的所有成员每个人都对本次迭代乃至整个项目过程付 ...

  6. Linux arm64的虚拟内存布局

    原创翻译,转载请注明出处. 页表转换arm64在硬件体系结构上支持4级的每页大小为4K的页表转换,也支持3级的页大小64KB的页表转换.在linux arm64中,如果页的大小为4KB,使用3级页表转 ...

  7. pta结构体链表作业

    一.PTA实验作业 7-2 1. 本题PTA提交列表 2. 设计思路 题目要求按照年龄从大到小的顺序依次输出,于是我只要用冒泡法把结构体变量从大到小排列就可以了. 3.本题调试过程碰到问题及PTA提交 ...

  8. 【工作感悟】——揭开“PM”的面纱

    [前言] 上次跟大家分享了面试的故事,小编觉得效果还不错,因此小编决定把工作感悟系列写下去,不过时间就不好说了.希望小伙伴们在评论列表中发表自己的看法和观点,积极参与啦~~ [背景] 初来Y公司,作为 ...

  9. Eclipse下JRebel6.5.0热部署插件安装、破解及配置

    发现一个问题:如果安装了jRebel,但是并未对项目添加jRebel监听时,如果重写jar包中的类, 虽然重写后的类会得到编译(classes中的class已经是修改后的class),但是并不会调用重 ...

  10. 怎么设置table(表格)手机端自适应宽度

    我们在wordpress文章页面经常会用到表格,有些是从其他网页或者文档复制粘贴过来的,在电脑设备网页上都能很好的展示,但是在移动设备上或者低分辨率设备上却经常撑破列宽,很是影响美观和客户体验.这里就 ...