标签为 "jQuery" 的存档

jquery ajax get success not called; ajax调用返回200,但是没有调用success的问题

管理后台不知道为啥出了点小bug,以前管用的一个功能突然不能用了,看了下数据接口是调用成功了,大周末的,又不好麻烦FE,只好自己看看了。

通过查看源代码发现,使用了jquery里的ajax方法,通过get回来的结果并没有按预期的执行success回调。

  $.ajax({
      url: '/antispammanage/filterSpecial/?kw='+encodeURIComponent(kw),
      type: 'get',
      dataType: 'json',
      success: function(data){
          var d = JSON.parse(data.trim());
          $('.producekw').val(d.kw);
      }

查看网络请求,接口是返回成功的。
然后对该方法添加了error回调,打印出返回信息,readystate=4,返回头是200,但是为啥就不success呢。

google了下后发现,原来问题出在返回信息的content-Type上,返回的不是json类型,但是ajax方法里指定了类型为json,所以ajax方法在解析json的时候出错了。解决办法有两个:
1.接口返回的header里指定content-Type为json,
2.ajax调用的时候,指定dataType为text,然后自己用JSON.parse进行解析。

jQuery,IE7,url,www,http,A Bug

今天遇到一个怪事,在一个页面下, 有一个区域,用来动态的显示一些数据,主要是显示一个url,会使用jQuery去动态的改变a标签的属性,来显示相关信息。
但是却发现,在IE7下,当改变了a标签的属性之后,凡是www开头的url,显示文本都会添加一个http://,让人费解。
后来发现是一个小bug,但是不确定是jQuery还是IE7的问题。
解决方案就在设定A标签的属性的顺序上。

//当顺序为
this.linkElem.html(data.dspurl).attr('href', data.link).attr('title', data.link);
//时,就会发生以上怪现象,但是如果改变其顺序
this.linkElem.attr('href', data.link).attr('title', data.link).text(data.dspurl);
//就会正常了。

Read more…

jquery 滑动 回到顶部代码

jQuery实现滑动回到顶部效果:

$('html, body').animate({scrollTop: 0},500);

Read more…

jQuery数组处理完全详解($.each,$.grep,$.map,$.merge,$.inArray,$.unique,$.makeArray)

jQuery的数组处理、便捷、功能齐全。最近的项目中用到的比较多,深感实用,一步到位的封装了很多原生JavaScript数组不能企及的功能。最近时间紧迫,今天抽了些时间回过头来看jQuery中文文档中对数组的介绍,顺便对jQuery数组做个总结,温故而知新。
强烈建议你打开DEMO演示后再看下面的详解:http://mrthink.net/demo/ijq20101125.htm

1. $.each(array, [callback]) 遍历[常用]

解释: 不同于例遍jQuery对象的$().each()方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引, 第二个为对应变量或内容. 如果需要退出each循环可使回调函数返回false, 其它返回值将被忽略。

each遍历,相信都不陌生,在平常的事件处理中,是for循环的变体,但比for循环强大。在数组中,它可以轻松的攻取数组索引及对应的值。例:

var _mozi=['墨家','墨子','墨翟','兼爱非攻','尚同尚贤']; //本文所用到的数组, 下同
$.each(_mozi,function(key,val){
    //回调函数有两个参数,第一个是元素索引,第二个为当前值
    alert('_mozi数组中 ,索引 : '+key+' 对应的值为: '+val);
});

相对于原生的for..in,each更强壮一点。for..in也可以遍历数组,并返回对应索引,但值是需要通过arrName[key]来获取。

2. $.grep(array, callback, [invert])过滤数组[常用]

解释: 使用过滤函数过滤数组元素.此函数至少传递两个参数(第三个参数为true或false,对过滤函数返回值取反,个人觉得用处不大): 待过滤数组和过滤函数. 过滤函数必须返回true以保留元素或 false 以删除元素. 另外,过滤函数还可以是可设置为一个字条串。

$.grep(_mozi,function(val,key){
    //过滤函数有两个参数,第一个为当前元素,第二个为元素索引
    if(val=='墨子'){
        alert('数组值为 墨子 的下标是: '+key);
    }
});

var _moziGt1=$.grep(_mozi,function(val,key){
    return key>1;
});
alert('_mozi数组中索引值大于1的元素为: '+_moziGt1);

var _moziLt1=$.grep(_mozi,function(val,key){
    return key>1;
},true);
//此处传入了第三个可靠参数,对过滤函数中的返回值取反
alert('_mozi数组中索引值小于等于1的元素为: '+_moziLt1);

Read more…

将 DIV 放置于 Flash之上 – ammap实战

做一个基于中国地图的数据展示。查找了一些资料,打算使用ammap,研究一番之后,终于明白一些。
通过设定数据文件ammap_data.xml中的area标签的url属性,可以设置为一个javascript:functionname();来调用一个JS函数。这下容易多了,可以通过JS去获得数据,添加到一个层,然后显示出来即可。
但是实践的时候又遇到一个问题,不管怎么设置层的CSS值,包括position,z-index,left,top 啊等等,层总是被flash给遮挡住,。查了点资料,原来flash是有一个属性设置的,可以设置是否置顶,不会被其它元素遮挡住。那么只要改一下就可以了。
ammap是用了封装好的一个swfobject类来生成flash的相关参数的,并且这个类是被压缩了的,。但是只要格式化一下就OK了。
然后找到<object></object>标签,在其中加入<param name=”wmode” value=”opaque” />,由于两边有双引号,自己注意加反斜线的转义。

好,现在试一下,诶?怎么不行?用IE看一下,结果IE下是可以的,但是chrome和firefox中都办不到。不用急,再在swfobject类中找到<embed>标签,对它加一个属性wmode=”opaque”,注意加转义字符。然后再打开看下效果。OK啦。

div放到flash之上-ammap-css-javascript-flash

div放到flash之上-ammap-css-javascript-flash

Read more…

jQuery- 对Select Option的操作集合大全

话不多说,直接上代码和注释,需要什么一看就明了。

//jQuery获取Select选择的Text和Value:

$("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发
var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
var checkValue=$("#select_id").val();  //获取Select选择的Value
var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值 

//jQuery设置Select选择的Text和Value:

$("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中
$("#select_id ").val(4);   //设置Select的Value值为4的项选中
$("#select_id option").attr("selected", true);   //设置Select的Text值为jQuery的项选中

//jQuery添加/删除Select的Option项:

$("#select_id").append("<option value='Value'>Text</option>");  //为Select追加一个Option(下拉项)
$("#select_id").prepend("<option value='0'>请选择</option>");  //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove();  //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove();  //删除Select中Value='3'的Option
$("#select_id option").remove();  //删除Select中Text='4'的Option

Read more…

jQuery 延迟 函数 让层延时几秒后消失

jquery 让一个div延时消失,纯jQuery,不用settimeout,就用jQuery写。

<script language='javascript' type='text/javascript'>
$(document).ready(
    function()
    {
        /**
        *1.delay函数是jquery 1.4.2新增的函数
        *2.hide函数里必须放一个0,不然延时不起作用
        */
        $('#divid').delay(10000).hide(0);
    }
);
</script>

Read more…

亲爱的PHP,我要离开你了,因为,我对NodeJs更有感

亲爱的PHP,

我知道这封信不会给你惊喜。我们在一起已经有一些时日了,但是,从今天开始,我们将分道扬镳。

写下这些并不容易。你和我共度了很长时间。很难相信,在10年前你就欢快的接受我,让我进入你的怀抱。你年轻,sexy,和我的前任Perl比起来,你犹如一阵清风。我们在一起没过多久,你开始给我带来效益,过去的十年,我的每一份工作都是以你为基础的。 我们拥有很多美好的时光。记不记我们上了CNN头版【1】,14天里就获得$500的进账?这些年,每一次动态创建PDF,我的脸上都会绽放出笑容。
但是我们仍然有艰难的日子。我希望在我的余生里,再也不要听到这个词“register globals”(注册全局变量)。你也知道,直到现在,我还留着和你一起创建SOAP客户端的伤疤。我们谁也不能保证可靠(不知道PHP V6 发布后,以及支持UTF-8后会是怎么样的情形?)。不论如何,我们此前总是能解决分歧。
Read more…

jquery用$.each处理返回的json数据

jquery用$.each处理返回的json数据:
例如,json数据如下:

[ 
{"Id": 10004, "PageName": "club"}, 
{"Id": 10040, "PageName": "qaz"}, 
{"Id": 10059, "PageName": "beauty"}
]

希望用jquery对此数据进行操作,使用$.each:

$.each(data, function(i, item) {
    alert(item.PageName);
});

本人亲测可行。
Read more…

jquery bind select onchange用法

在使用jquery时,bind了onchange,但是却不能生效,经查实后,发现,需要bind的是change,才会出发如select等的onchange动作。

$('#region').bind('change',function(){
alert('t');
});

Read more…