jquery实际项目中的JS例子.

最新推荐文章于 2022-06-27 10:28:17 发布
最新推荐文章于 2022-06-27 10:28:17 发布
阅读量1.3k 收藏 1
点赞数
文章标签： jquery function iframe action image ajax
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/marty_zhu/article/details/2213792
版权

$(document).ready(function(){
 
 $("#information").hide();//个人信息
 
    $("#goodloadceng").hide();//"系统加载中"显示层
   
    $("#modifycode").hide();//修改密码
   
    $("#notebookA").hide();//地址薄
   
    $("#addlpk").hide();//礼品卡
   
    $("#addbzd").hide();//包装袋
   
    $("#wjdc").hide();//问卷调查
  
    $("#Layer2").hide();//vip修改模特
   
    $("#createmd").hide();//vip创建模特1216
    //只加载一次
    var isNewProductLoaded = false;
   
    $("#myyigui").Accordion({
        headerSelector: '.header',
        panelSelector: '.panel',
        panelHeight: 650,
        speed: 400
    });
   
   
   
    $("#shoucangtitle").click(function(){
     //alert("hello");
     $.post("vipyiguilist.action",{},function(data){
   //alert("data:"+data);
      $("#vipyigui").html(data);
      setWardrobsTotalRecords();
  });
         
    });
   
   
   
    /*
     * 最新产品
     */
    
    
    
    
    
    
    $("#newProduct").click(function(){
        if (!isNewProductLoaded) {
            $.get("getLastestProductList.action", {
                "product.flag": 0,
                 "product.category":1
            }, function(data){
                $("#newProductPanel").html(data);
            });
            isNewProductLoaded = true;
        }
    });
   
    $("#goodloadceng").ajaxStart(function(){
        $(this).show();
    });
   
    $("#goodloadceng").ajaxStop(function(){
        $(this).hide();
    });
   
    $("#myLatestBuy").click(function(){
   
        $.post("/verfy/back.jsp");
    });
   // alert("i am in ready");
    //模特库列表  在页面加载的时候向div中注值
    $.post("vipGetModelList.action",{},function(data){
     //$("#modelNumber").html(data);
     $("#mymodelM").html(data);
     
     setModelsTotalRecords();
     
    });
    /*
     * 我的衣柜列表
     */
  $.post("vipyiguilist.action",{},function(data){
   //alert("data:"+data);
      $("#vipyigui").html(data);
      setWardrobsTotalRecords();
  });

});

//模特分页

function navPages(page){
    $(document).ready(function(){
        // 右面搜索结果的ajax页面
       
       
         names=$("#modelName").val();
 modelName="%"+names+"%";
 //alert("modelName:"+modelName);
 //alert($("#gender").val());
  $.post("vipModelList.action",{
   "page.currentPage": page,
   'models.gender':$("#gender").val(),
   'models.name':modelName},
     function(data){
        $("#mymodelM").html(data);
              setModelsTotalRecords(); 
      
     });
    });
}


function getPages(){
 var page = $("#pageRequests").val();
 // TODO: 对页码的验证
 //alert("page:"+page);
 navPages(page);
}

 

function navPage(page){
    $(document).ready(function(){
        // 右面搜索结果的ajax页面
       
         var price =$("#price").val();
  //alert("price:"+price);
       var priceReg = /^(/d*)-(/d*)$/;
   priceReg.test(price);
   minPrice = RegExp.$1;
   //alert("minPrice:"+minPrice);
   maxPrice = RegExp.$2;
       
       
      
//                "priceRange.maxPrice":maxPrice,
//                "priceRange.minPrice":minPrice,
//                "product.publishTime":publishTimes,
       // alert($("#pushTime").val());
        $.get("getLastestProductList.action", {
            "product.flag": $("#productflag").val(),
            "priceRange.maxPrice":maxPrice,
            "product.publishTime":$("#pushTime").val(),
            "page.currentPage": page,
             "product.category":1,
             "str":$("#pushTime").val()
        }, function(data){
            $("#newProductPanel").html(data);
        });
       
    });
}

function getPage(){
 var page = $("#pageRequest").val();
 // TODO: 对页码的验证
 navPage(page);
}


//收藏柜
function vipNavPage(page){
    $(document).ready(function(){
        // 右面搜索结果的ajax页面
        $.get("vipyiguilist.action", {
            "page.currentPage": page
        }, function(data){
            $("#vipyigui").html(data);
        });
       
    });
}

function vipGetPage(){
 var page = $("#vipyiguiGo").val();
 //alert($("#vipyiguiGo").val());
 // TODO: 对页码的验证
   $(document).ready(function(){
        // 右面搜索结果的ajax页面
        $.get("vipyiguilist.action", {
            "page.currentPage": page
        }, function(data){
            $("#vipyigui").html(data);
        });
       
    });
}

 

var isOpen=false;
//在同一时间内只允许展开一个层.

/*
 * 打开一个对话框
 */
function openDialog(str,content,action,width,height){
 /*
  * str 父层
  * content 内容层
  * action 处理iframe src的url
  * width iframe 的宽度
  * height iframe的高度
  */
 // alert("str:"+str);
  //alert("hi");
  if(!isOpen){
 
 $(str).OpenVertically(1000);/*打开的时间间隔为一秒*/
 $(str).Draggable(
 {
  zIndex:  1000,
  ghosting: true,
  opacity:  0.7/*透明*/
 });
 /*600,480*/
 var html="<iframe id='f+"+str+"+f' src='"+action+"' width='"+width+"' frameborder='0' height='"+height+"' scrolling=/"no/" ></iframe>";

 $(content).html(html);
 $(content).show();

 
  isOpen=true;
  }
}

/*
 * 关闭一个对话框
 */
function closeDialog(str,content){
 
 /*str 父层
  *content 内容层
  */
 //alert('dd');
 $(content).hide();
 $(str).CloseVertically(1000);
 $(str).DraggableDestroy();
 $(str).hide();
 
 isOpen=false;

}
/*
 * 模特库
 */
function vipdelModel(modelId,modelName){
 //alert("modelId:"+modelId);
 
     if(confirm('确定删除选定的记录吗?'))
    {
     $.post("vipDelModel.action",{"modelId":modelId},function(data){
              $("#mymodelM").html(data);
              setModelsTotalRecords();
      });
        var str=document.getElementById("modelForDEL").value;
      //alert(str);
      //alert(modelId);
      if(str==modelName){
       document.getElementById("modelTestShirt").innerHTML="一格标准模特";
       
  document.getElementById("genders").value=0;
  document.getElementById("waistLine").value=80;
  document.getElementById("height").value=170; 
  document.getElementById("age").value=20; 
  document.getElementById("skinColor").value=1;
  document.getElementById("hairColor").value=1;
  document.getElementById("hairStyle").value=1;
 
   document.getElementById("cloth").value=0;
   document.getElementById("trousers").value=0;
   document.getElementById("shoe").value=0;
   document.getElementById("hat").value=0;
   document.getElementById("glasses").value=0;
   document.getElementById("bag").value=0;
      document.getElementById("earing").value=0;
   document.getElementById("necklace").value=0;
   document.getElementById("view").value=1;
   document.getElementById("back").value=1;
   juedu=0;
   document.getElementById("modelForDEL").value="";
       
       
       //alert(juedu);
       var modelPic=document.getElementById("3dman");
           var webPic=document.getElementById("picWebForDel").value;
            image=webPic+"/img/modelpic/man.jpg";
           var src_pic ="<img id='pic' src='"+image+"' />";
           modelPic.innerHTML=src_pic;
       
      }
    }
}

 function deleteModelsAll(id){
 var OneAreInUpdate=document.getElementById("hiddenOrShowDe").value;
 //alert(OneAreInUpdate);
 if(OneAreInUpdate!=""){
  alert("有模特正在修改不能删除");
  return false;
 }else{
    
     if(confirm('确定删除选定的记录吗?'))
    {
     
  var allcheck=document.getElementsByName(id);
  //alert("allcheck:"+allcheck);
        for(var i=0;i<allcheck.length;i++)
        {
       var modelId=allcheck[i].value;
        $.post("vipDelModel.action",{"modelId":modelId},function(){
     
    });
        }
     $.post("vipGetModelList.action",{},function(data){
              $("#mymodelM").html(data);
              setModelsTotalRecords(); 
      });
      
      
      document.getElementById("modelTestShirt").innerHTML="一格标准模特";
       
  document.getElementById("genders").value=0;
  document.getElementById("waistLine").value=80;
  document.getElementById("height").value=170; 
  document.getElementById("age").value=20; 
  document.getElementById("skinColor").value=1;
  document.getElementById("hairColor").value=1;
  document.getElementById("hairStyle").value=1;
 
   document.getElementById("cloth").value=0;
   document.getElementById("trousers").value=0;
   document.getElementById("shoe").value=0;
   document.getElementById("hat").value=0;
   document.getElementById("glasses").value=0;
   document.getElementById("bag").value=0;
      document.getElementById("earing").value=0;
   document.getElementById("necklace").value=0;
   document.getElementById("view").value=1;
   document.getElementById("back").value=1;
   juedu=0;
   document.getElementById("modelForDEL").value="";
       
       
       //alert(juedu);
       var modelPic=document.getElementById("3dman");
           var webPic=document.getElementById("picWebForDel").value;
            image=webPic+"/img/modelpic/man.jpg";
           var src_pic ="<img id='pic' src='"+image+"' />";
           modelPic.innerHTML=src_pic;
       
      
      
      
      
    }
 }
   
  
   
 }

function getModelsList(){
 //alert("hao");
  $.post("vipGetModelList.action",{},function(data){
      
     $("#mymodelM").html(data);
     setModelsTotalRecords();
     
    });
 
}
//根据性别与创建日期来查询模特
function getModelsByGender(){
 //alert("ss");
 names=$("#modelName").val();
 modelName="%"+names+"%";
 //alert("modelName:"+modelName);
 //alert($("#gender").val());
  $.post("vipModelList.action",{
   'models.gender':$("#gender").val(),
   'models.name':modelName},
     function(data){
        $("#mymodelM").html(data);
              setModelsTotalRecords(); 
      
     });
 
}


/*
 * 收藏衣柜
 */
//删除一个收藏
function deleteWardrobes(wardrobsId){
     if(confirm("确定删除选定的收藏吗?")){
  $.post("vipyiguiDelete.action",{"wardId":wardrobsId},function(data){
      // alert("data:"+data);
     $("#vipyigui").html(data);
      setWardrobsTotalRecords();
 
});
}
}

//增加一个收藏

 function saveToWardrobes(productId,userId){
  if(userId==""||userId==null){
      alert("您还没有登录,请您先登录!");
      return false;
  }else{
     wardrobesServie.doInsertWardrobe(productId,userId,getBackInt);
   }
  }
  
  function getBackInt(msg){
  if(msg==0)
    alert("产品已经成功地收藏到衣柜!");
  }

//统计衣柜件数

function setWardrobsTotalRecords(){
   var numModelList=document.getElementById("wardTotalRecords").value;
   //alert("numModelList:"+numModelList);
   var numVip=document.getElementById("wardrobsNumber");
   //alert("numVip:"+numVip);
   numVip.innerHTML=numModelList;
 
}

 


//统计模特个数
function setModelsTotalRecords(){
   var numModelList=document.getElementById("totalRecords").value;
   //alert("numModelList:"+numModelList);
   var numVip=document.getElementById("modelNumber");
   //alert("numVip:"+numVip);
   numVip.innerHTML=numModelList;
 
}

//模特全选与全不选
function selectedAll(x){
       // alert("x:"+x);
       var allcheck=document.getElementsByName("ids");
     // alert("allcheck:"+allcheck);
     
       if(x==1){
        for(var i=0;i<allcheck.length;i++)
        {
        allcheck[i].checked=true;
        }       
       }
       if(x==2){
  
          for(var i=0;i<allcheck.length;i++){
           allcheck[i].checked=false;
          }
       }
}

//最新产品 条件查询
 function vipProducList(){
  //价格范围
  var price =$("#price").val();
  //alert("price:"+price);
       var priceReg = /^(/d*)-(/d*)$/;
   priceReg.test(price);
   minPrice = RegExp.$1;
   //alert("minPrice:"+minPrice);
   maxPrice = RegExp.$2;
   //alert("maxPrice:"+maxPrice);
   
   //document.getElementById("maxPriceForSearch").value=maxPrice;
   
   //上架时间
   var str=$("#pushTime").val();
   //alert("str:"+str)
   if(str==''||str==null){
   var today = new Date();
   var year = today.getFullYear();
   var month = today.getMonth();
   var dat = today.getDate();
   dat -= Number(str);
  // alert("dat:"+dat);
   var today = new Date(year,month,dat);
        //     alert("today:"+today);
   var publishTime = ""+today.getFullYear()+"-" +(today.getMonth()+1)+"-"+today.getDate();
   publishTimes = publishTime;
   }else{
    publishTimes='';
   }
  // alert("publishTimes:"+publishTimes);
  
  $.post("getLastestProductList.action", {
                "product.flag": $("#productflag").val(),
                "priceRange.maxPrice":maxPrice,
                "priceRange.minPrice":minPrice,
                "product.publishTime":publishTimes,
                 "product.category":1,
                "str":str
            },function(data){
   
    $("#newProductPanel").html(data);
  });
 }
 
 
 //我的衣柜条件查询
 /*
  * 得重新写一个action
  */
 function vipWardrobesList(){
   //价格范围
  var price =$("#wardPrice").val();
  //alert("price:"+price);
  //允许不选价格查询
  if(price!=null && price!=''){
       var priceReg = /^(/d*)-(/d*)$/;
   priceReg.test(price);
   minPrice = RegExp.$1;
  // alert("minPrice:"+minPrice);
   maxPrice = RegExp.$2;
   //alert("maxPrice:"+maxPrice);
  }else{
   minPrice ='';
   maxPrice ='';
  }
   
   //上架时间
   var str=$("#wardSaveTime").val();
   //alert("str:"+str)
   //允许不选时间查询
   if(str!=null && str!==''){
   var today = new Date();
   var year = today.getFullYear();
   var month = today.getMonth();
   var dat = today.getDate();
   dat -= Number(str);
   //alert("dat:"+dat);
   var today = new Date(year,month,dat);
        //     alert("today:"+today);
   var publishTime = ""+today.getFullYear()+"-" +(today.getMonth()+1)+"-"+today.getDate();
   publishTimes = publishTime;
   //alert("publishTimes:"+publishTimes);
   }else{
    publishTimes='';
   }
   
  
  
  
   $.post("vipyiguilistOther.action",
   {
    "wardrobes.choosetime":publishTimes,
    "wardrobes.productType":$("#wardType").val(),
    "priceRange.maxPrice":maxPrice,
    "priceRange.minPrice":minPrice
   },function(data){
   
      $("#vipyigui").html(data);
  
  });
 }

 

 

 

 

 

marty_zhu
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
jQuery案例
WangZhang_521的博客
05-06 2648
01-精品展示案例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
Jquery项目案例
05-12
Jquery案例，里面有图片的自动切换，留言板，编辑框，都是用Jquery技术开发的，代码清晰，
jQuery项目案例
qq_52108058的博客
06-27 4943
2、微博发布 3、移动水果 4、上下拉切换 5、精品演示 6、tab标签切换 7、突出显示 总结 li:first li:last li:eq(2) li:odd --奇数 li:even --偶数 ul li --子代 ul
JQuery项目
10-16
jQuery项目实例开发，案例齐全，全面 对你肯定有很大帮助！
Jquery——简单例子
Zjaun的博客
02-13 2164
制作简易版jquery插件 &amp;lt;script src=&quot;jquery.bgColor.js&quot;&amp;gt;&amp;lt;/script&amp;gt; &amp;lt;script&amp;gt; $(function () { $(&quot;div&quot;).bgColor(&quot;red&quot;).width(400); }); &amp;lt;/sc
JQuery案例
m0_51064043的博客
04-02 960
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录一、基础案例1.隔行换色2.全选和全不选3.QQ表情选择4.多选下拉列表左右移动二、高级1.广告的自动显示与隐藏2.抽奖 一、基础案例 1.隔行换色 需求：将数据行的奇数行背景色设置为 pink，偶数行背景色设置为 yellow <script> //需求：将数据行的奇数行背景色设置为 pink，偶数行背景色设置为 yellow $(function () { //1. 获取数据行的奇数行的t.
jquery.wordexport.js:jquery.wordexport.js
05-11
- 在实际项目中，考虑对非支持环境提供备选方案，如提示用户升级浏览器或使用其他导出方式。 ### 5. 扩展应用 除了基本的导出功能，jQuery.wordexport.js还可以与其他jQuery插件结合使用，比如表格插件，使得用户...
FileSaver.js和jquery.wordexport.js插件
01-06
在实际项目中，需要考虑兼容性问题，可以使用条件语句或polyfill来确保在较老的浏览器上也能实现类似的功能。 在使用FileSaver.js和jquery.wordexport.js时，还需要注意数据的安全性和隐私问题，因为它们允许用户...
JQuery信息提示框插件 jquery.toast.js 的使用
08-18
通过查看和运行这些例子，你可以看到不同的配置选项如何影响提示框的显示效果，并学习如何在实际项目中应用。 总结，`jQuery.toast.js` 提供了一个强大且易于使用的提示框解决方案，无论是在开发过程中调试还是在向...
jquery小型事例项目
09-30
这个里面的例子 很适合初学者来体验jquery的强大之处，现在我把这个项目贴出来，和大家一起分享，下载后到各个浏览器上运行都兼容，希望能够帮助到各位！
js 小项目练习，jQuery 小例子
04-10
js 小项目练习，jQuery 小例子。 使用jquery写的一些小例子，比如菜单，星级评分，轮播图，拖拽上传等效果源码。 jquery小项目
jQuery 选择器项目实例分析及实现代码
12-11
首先废话一句，jQuery选择器真心很强大！ 在项目中遇到这么一个问题easyui的问题  如图所示，当前页面显示的是“原始报文查询”的页面，当时左侧导航栏却选中的是“重发报文查询”。如何让右侧的菜单和左侧的导航实现联动即：左侧点击“原始报文查询”，那么右侧的“补发运抵报文”展开，并选中“原始报文查询”，“后台管理”关闭？ 实现方式如下： 1、右侧的“原始报文查询”等用到的是easyui的tabs控件，查看api知道，tabs有个onSelect方法，只要在onSelect方法中写入自己想做的事情就可以了。 2、触发事件是找到了，那么具体怎么实现想要的效果呢？ 　 左侧导航栏代码结果如上图：最
50 个jQuery 实例（包含各种常用网页效果）
07-28
50 个jQuery 实例，包含各种常用网页效果：选项卡切换，手风琴效果，相片画廊，验证规则，表格等。
jQuery实战
01-09
《jQuery实战》全面介绍jQuery知识，展示如何遍历HTML文档、处理事件、执行动画以及给网页添加Ajax。书中紧紧地围绕“用实际的示例来解释每一个新概念”这一宗旨，生动描述了jQuery如何与其他工具和框架交互以及如何生成jQuery插件。jQuery是目前最受欢迎的JavaScript/Ajax库之一，能用最少的代码实现最多的功能。《jQuery实战》适合各层次Web开发人员。
jquery-ui.min.js
11-07
在本文中，我们将深入探讨jQuery UI的核心功能，尤其是标题所提及的`jquery-ui.min.js`文件，以及其在实际开发中的应用。 首先，`jquery-ui.min.js`是jQuery UI的压缩和优化版本，用于提高页面加载速度并减少网络...
jQueryZoom放大图片插件例子.zip
06-11
在“jQueryZoom放大图片插件例子.zip”压缩包中，包含了该插件的应用实例，帮助开发者更好地理解和运用。 jQueryZoom的核心功能在于，当用户将鼠标悬停在图片上方或点击图片时，可以以平滑的方式放大图片的细节部分...
jQuery 实例
世事如棋__2016的博客
02-19 846
* 提示：ready() 函数不应与 一起使用。    *  jQuery 库位于一个 JavaScript 文件中，其中包含了所有的 jQuery 函数。       可以通过下面的标记把 jQuery 添加到网页中：    1.允许使用以下三种语法：     1.$(document).ready(function)     2.$().ready(function)
jQuery应用实例
m0_55997161的博客
04-21 998
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="js/jquery-1.7.2.js"></script> <script> $(function () { ...
jQuery validate.js验证插件基础使用教程
此外，还可以使用`.format()`函数来自定义错误信息中的动态内容，如`lang('ls_password_length')`后跟`.format()`，这样在输出错误信息时会将规则中的{0}和{1}替换为实际的最小和最大长度值。 `.errorPlacement`...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值