所有浏览器通用的js添加收藏夹代码 <script> function addfavorite() { if (document.all) { window.external.addFavorite('http://www.XXX.com','XXX');&

jQuery Ajax 实例 ($.ajax、$.post、$.get)不刷新提交

$.post、$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()

 

一、$.ajax的一般格式

$.ajax({
     type: 'POST',
     url: url ,
    data: data ,
    success: success ,
    dataType: dataType
});

二、$.ajax的参数描述

参数 描述

url    必需。规定把请求发送到哪个 URL。    

data    可选。映射或字符串值。规定连同请求发送到服务器的数据。    

success(data, textStatus, jqXHR)    可选。请求成功时执行的回调函数。    

dataType    

可选。规定预期的服务器响应的数据类型。

默认执行智能判断(xml、json、script 或 html)。

三、$.ajax需要注意的一些地方:

  1.data主要方式有三种,html拼接的,json数组,form表单经serialize()序列化的;通过dataType指定,不指定智能判断。

  2.$.ajax只提交form以文本方式,如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit

四、$.ajax网上的应用例子

//1.$.ajax带json数据的异步请求
var aj = $.ajax( {  
    url:'productManager_reverseUpdate',// 跳转到 action  
    data:{  
             selRollBack : selRollBack,  
             selOperatorsCode : selOperatorsCode,  
             PROVINCECODE : PROVINCECODE,  
             pass2 : pass2  
    },  
    type:'post',  
    cache:false,  
    dataType:'json',  
    success:function(data) {  
        if(data.msg =="true" ){  
            // view("修改成功!");  
            alert("修改成功!");  
            window.location.reload();  
        }else{  
            view(data.msg);  
        }  
     },  
     error : function() {  
          // view("异常!");  
          alert("异常!");  
     }  
});


//2.$.ajax序列化表格内容为字符串的异步请求
function noTips(){  
    var formParam = $("#form1").serialize();//序列化表格内容为字符串  
    $.ajax({  
        type:'post',      
        url:'Notice_noTipsNotice',  
        data:formParam,  
        cache:false,  
        dataType:'json',  
        success:function(data){  
        }  
    });  
}  


//3.$.ajax拼接url的异步请求
var yz=$.ajax({  
     type:'post',  
     url:'validatePwd2_checkPwd2?password2='+password2,  
     data:{},  
     cache:false,  
     dataType:'json',  
     success:function(data){  
          if( data.msg =="false" ) //服务器返回false,就将validatePassword2的值改为pwd2Error,这是异步,需要考虑返回时间  
          {  
               textPassword2.html("<font color='red'>业务密码不正确!</font>");  
               $("#validatePassword2").val("pwd2Error");  
               checkPassword2 = false;  
               return;  
           }  
      },  
      error:function(){}  
}); 


//4.$.ajax拼接data的异步请求
$.ajax({   
    url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',   
    type:'post',   
    data:'merName='+values,   
    async : false, //默认为true 异步   
    error:function(){   
       alert('error');   
    },   
    success:function(data){   
       $("#"+divs).html(data);   
    }
});

js select多选取值

<html>
<head>
<script type="text/javascript">
function selectMultiple()
  {
  var o = document.getElementById("mySelect");
  var str = "";
  for(i=0;i<o.length;i++){   
                if(o.options[i].selected){
                    str+=o.options[i].value+",";
                }
            }
  alert( str.substr(0,str.length-1) );
  }
</script>
</head>
<body>
<form>
<select id="mySelect" size="4" multiple="true">
  <option value="b">苹果</option>
  <option value="c">桃子</option>
  <option value="d">香蕉</option>
  <option value="e">桔子</option>
</select>
<input type="button" onclick="selectMultiple()" value="取值">
</form>
<p>在您点击 “取值” 按钮之前,可查看所选值的内容。</p>
</body>
</html>

js遍历当前页面所有元素

function getHasTitles (parentNode) {
  var allNodes = parentNode.getElementsByTagName('*');
  var length = allNodes.length;
  var i;
  var hasTitles = [];
  var node;
  for (i = 0; i < length; i++) {
    node = allNodes[i];
    if (node.title) {
      hasTitles.push(node);
    }
  }
  return hasTitles;
}
 
var hasTitles = getHasTitles(document);

jquery得到所有元素

$("*")
$("#table *")
/*结果:
[ <div>DIV</div>, <span>SPAN</span>, <p>P</p> ] */

  jQuery的鼠标移入事件

$(function () {
            $("#div1").mouseover(function () {
                $(this).hide("fast");
            });
            $("#div1").mouseleave(function () {
                $(this).show("fast");
            });
        });
 $(function(){
$('#div').hover(function(){
function(){$(this).hide()},
function(){$(this).show()}
})
})

  jQuery的显示隐藏

$(this).hide()
$(this).show()

所有浏览器通用的js添加收藏夹代码

 <script> 
function addfavorite() 
{ 
if (document.all) 
{ 
window.external.addFavorite('http://www.XXX.com','XXX'); 
} 
else if (window.sidebar) 
{ 
window.sidebar.addPanel('XXX', 'http://www.XXX.com', ""); 
} 
} 
</script> 
<a href="#" onclick="addfavorite()">XXX</a>

 打开,另存为,属性,打印"等14个JS代码
■刷新■
■导入收藏■
■导出收藏■
■整理收藏夹■
■查看原文件■
■语言设置■
■打开■
<input name=Button onClick=document.all.WebBrowser.ExecWB(1,1) type=button value=打开>
<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
■另存为■
<input name=Button onClick=document.all.WebBrowser.ExecWB(4,1) type=button value=另存为><OBJECT classid=CLSID:8856F961-
340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
■属性■
<input name=Button onClick=document.all.WebBrowser.ExecWB(10,1) type=button value=属性><OBJECT classid=CLSID:8856F961-
340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
■打印■
<input name=Button onClick=document.all.WebBrowser.ExecWB(6,1) type=button value=打印><OBJECT classid=CLSID:8856F961-
340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
■页面设置■
<input name=Button onClick=document.all.WebBrowser.ExecWB(8,1) type=button value=页面设置><OBJECT classid=CLSID:8856F961
-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0></OBJECT>
■刷新■
<input type=button value=刷新 name=refresh onclick="window.location.reload()">
■导入收藏■
<input type="button" name="Button" value="导入收藏夹" onClick=window.external.ImportExportFavorites(true,);>
■导出收藏■
<input type="button" name="Button3" value="导出收藏夹" onClick=window.external.ImportExportFavorites(false,);>
■加入收藏■
<INPUT name=Button2 onclick="window.external.AddFavorite(location.href, document.title)" type=button value=加入收藏夹>
■整理收藏夹■
<INPUT name=Submit2 onclick="window.external.ShowBrowserUI(OrganizeFavorites, null)" type=button value=整理收藏夹>
■查看原文件■
<INPUT name=Button onclick=window.location = "view-source:" + window.location.href type=button value=查看源文件>
■语言设置■
<INPUT name=Button onclick="window.external.ShowBrowserUI(LanguageDialog, null)" type=button value=语言设置>
■前进■
<INPUT name=Submit onclick=history.go(1) type=submit value=前进>
■后退■
<INPUT name=Submit2 onclick=history.go(-1) type=submit value=后退>

一、【文件(F)】菜单中的命令的实现
1、〖打开〗命令的实现
[格式]:document.execCommand("open")
[说明]这跟VB等编程设计中的webbrowser控件中的命令有些相似,大家也可依此琢磨琢磨。
[举例]在<body></body>之间加入:
<a href="#" onclick=document.execCommand("open")>打开</a>
2、〖使用 记事本 编辑〗命令的实现
[格式]:location.replace("view-source:"+location)
[说明]打开记事本,在记事本中显示该网页的源代码。
[举例]在<body></body>之间加入:
<a href="#" onclick=location.replace("view-source:"+location)>使用 记事本 编辑</a>
3、〖另存为〗命令的实现
[格式]:document.execCommand("saveAs")
[说明]将该网页保存到本地盘的其它目录!
[举例]在<body></body>之间加入:
<a href="#" onclick=document.execCommand("saveAs")>另存为</a>
4、〖打印〗命令的实现
[格式]:document.execCommand("print")
[说明]当然,你必须装了打印机!
[举例]在<body></body>之间加入:
<a href="#" onclick=document.execCommand("print")>打印</a>
5、〖关闭〗命令的实现
[格式]:window.close();return false
[说明]将关闭本窗口。
[举例]在<body></body>之间加入:
<a href="#" onclick=window.close();return false)>关闭本窗口</a>

二、【编辑(E)】菜单中的命令的实现
〖全选〗命令的实现
[格式]:document.execCommand("selectAll")
[说明]将选种网页中的全部内容!
[举例]在<body></body>之间加入:
<a href="#" onclick=document.execCommand("selectAll")>全选</a>

三、【查看(V)】菜单中的命令的实现
1、〖刷新〗命令的实现
[格式]:location.reload() 或 history.go(0)
[说明]浏览器重新打开本页。
[举例]在<body></body>之间加入:
<a href="#" onclick=location.reload()>刷新</a>
或加入:<a href="#" onclick=history.go(0)>刷新</a>
2、〖源文件〗命令的实现
[格式]:location.replace("view-source:"+location)
[说明]查看该网页的源代码。
[举例]在<body></body>之间加入:
<a href="#" onclick=location.replace("view-source:"+location)>查看源文件</a>
3、〖全屏显示〗命令的实现
[格式]:window.open(document.location,"url","fullscreen")
[说明]全屏显示本页。
[举例]在<body></body>之间加入:
<a href="#" onclick=window.open(document.location,"url","fullscreen")>全屏显示</a>

四、【收藏(A)】菜单中的命令的实现
1、〖添加到收藏夹〗命令的实现
[格式]:window.external.AddFavorite('url', '"网站名")
[说明]将本页添加到收藏夹。
[举例]在<body></body>之间加入:
<a href="javascript:window.external.AddFavorite('添加到收藏夹 " target="_blank">http://oh.jilinfarm.com', '胡明新的个
人主页')">添加到收藏夹</a>
2、〖整理收藏夹〗命令的实现
[格式]:window.external.showBrowserUI("OrganizeFavorites",null)
[说明]打开整理收藏夹对话框。
[举例]在<body></body>之间加入:
<a href="#" onclick=window.external.showBrowserUI("OrganizeFavorites",null)>整理收藏夹</a>

五、【工具(T)】菜单中的命令的实现
〖internet选项〗命令的实现
[格式]:window.external.showBrowserUI("PrivacySettings",null)
[说明]打开internet选项对话框。
[举例]在<body></body>之间加入:
<a href="#" onclick=window.external.showBrowserUI("PrivacySettings",null)>internet选项</a>

六、【工具栏】中的命令的实现
1、〖前进〗命令的实现
[格式]history.go(1) 或 history.forward()
[说明]浏览器打开后一个页面。
[举例]在<body></body>之间加入:
<a href="#" onclick=history.go(1)>前进</a>
或加入:<a href="#" onclick=history.forward()>前进</a>
2、〖后退〗命令的实现
[格式]:history.go(-1) 或 history.back()
[说明]浏览器返回上一个已浏览的页面。
[举例]在<body></body>之间加入:
<a href="#" onclick=history.go(-1)>后退</a>
或加入:<a href="#" onclick=history.back()>后退</a>
3、〖刷新〗命令的实现
[格式]:document.reload() 或 history.go(0)
[说明]浏览器重新打开本页。
[举例]在<body></body>之间加入:
<a href="#" onclick=location.reload()>刷新</a>
或加入:<a href="#" onclick=history.go(0)>刷新</a>

七、其它命令的实现
〖定时关闭本窗口〗命令的实现
[格式]:settimeout(window.close(),关闭的时间)
[说明]将关闭本窗口。
[举例]在<body></body>之间加入:
<a href="#" onclick=setTimeout(window.close(),3000)>3秒关闭本窗口</a>

javascript 获取当前 URL 参数的两种方法:

//返回的是字符串形式的参数,例如:class_id=3&id=2& 
function getUrlArgStr(){ 
    var q=location.search.substr(1); 
    var qs=q.split('&'); 
    var argStr=''; 
    if(qs){ 
        for(var i=0;i<qs.length;i++){ 
            argStr+=qs[i].substring(0,qs[i].indexOf('='))+'='+qs[i].substring(qs[i].indexOf('=')+1)+'&'; 
        } 
    } 
    return argStr; 
} 
//返回的是对象形式的参数 
function getUrlArgObject(){ 
    var args=new Object(); 
    var query=location.search.substring(1);//获取查询串 
    var pairs=query.split(",");//在逗号处断开 
    for(var i=0;i<pairs.length;i++){ 
        var pos=pairs[i].indexOf('=');//查找name=value 
        if(pos==-1){//如果没有找到就跳过 
            continue; 
        } 
        var argname=pairs[i].substring(0,pos);//提取name 
        var value=pairs[i].substring(pos+1);//提取value 
        args[argname]=unescape(value);//存为属性 
    } 
    return args;//返回对象 
}

另外列出一些 javascript 获取url中各个部分的功能方法:

window.location.host; //返回url 的主机部分,例如:www.xxx.com 
window.location.hostname; //返回www.xxx.com 
window.location.href; //返回整个url字符串(在浏览器中就是完整的地址栏),例如:www.xxx.com/index.php?class_id=3&id=2 
window.location.pathname; //返回/a/index.php或者/index.php 
window.location.protocol; //返回url 的协议部分,例如: http:,ftp:,maito:等等。 
window.location.port //url 的端口部分,如果采用默认的80端口,那么返回值并不是默认的80而是空字符

关于JQ SCROLL滚动到一定距离触发事件

$(document).ready(function(){
$(window).scroll(function(){
    if($(window).scrollTop()>100){
       $("div").animate({left:'250px'});  
      });
   });
});

 

上一篇:jq获取和设置元素的css属性值

下一篇:php页面实时缓存实现方法

评论列表
发表评论
称呼
邮箱
网址
验证码(*)
热评文章
相关阅读