2013年3月 的存档

jquery 操作select radio box 备忘

2013年3月31日 没有评论

select框操作

获取值
$('#select').val()

设置值为xx的项为选中
$('#select').val(xx)

设置文本信息为yy的项为选中
$('#select option[text="yy"]').attr("selected", true);

radio box 操作

获取值
$('input[name="xx"]:checked').val()

设置值为xx的为选中
$('input[name="xx"]:radio[value="yy"]').attr('checked', 'checked');

jquery 获取父节点

2013年3月31日 没有评论

在使用jquery时,很多时候都需要获取当前节点的父节点,包括直接父节点和祖先父节点。用的最多的方法是parent([expr])和parents([expr])。从方法的名字上就可以判断前一个方法是单数,也就是返回一个真正的父节点,后面是返回所有的祖先节点集合(不包含根节点)。假设需要获取当前节点的祖父节点(父节点的父节点),其有属性class=”pp”,那么获取的方法为:

$('#cur').parent().parent();
或
$('#cur').parent().parent('.pp');
或
$('#cur').parent('.pp');

上述操作在理想情况下,都没有问题。例如后来修改页面,在当前节点上又加了一个父节点,那么前两种获取的到的节点就不是当初节点;另外如果其祖先节点中还有属性class=”pp” 的节点,第三种获取的节点也不是自己想要的。

现在介绍另外一个获取父节点的方法closest([expr])。closest会首先检查当前元素是否匹配,如果匹配则直接返回元素本身。如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。否则返回一个空的jquery对象。

$('#cur').closest('.pp');

使用上述操作获取含义特定属性的祖父节点相对要安全一些,即使在当前节点和祖父节点中增加或者减少节点,只要增加的节点没有相同的属性,已有的js代码可能都不需要进行修改。

最后说一下closest和parents的主要区别是:

  1. 前者从当前元素开始匹配寻找,后者从父元素开始匹配寻找
  2. 前者逐级向上查找,直到发现匹配的元素后 就停止了,后者一直向上查找直到根元素,然后把这些元素放进一个临时集合中,再用给定的选择器表达式去过滤
  3. 前者返回0或1个元素,后者可能包含0 个,1个,或者多个元素
分类: web前端 标签:

js做大小比较时警惕对象类型

2013年3月27日 没有评论

通过js获取页面两个数字输入框的值,并对其进行大小比较。此时出来的结果可能让你迷惑不解,例如代码:

    var v1 = $('#input1').val();
    var v2 = $('#input2').val();

    alert(v1 > v2);

假如input1中输入10,input2中输入2。10肯定是大于2的,所以上面的alert框应该弹出true,但实际上给出的是false。原因何在?对应数字10大于2是毫无疑问的,如果是作为字符串比较,那么结果刚好相反。而上述从页面获取值得到的类型是String。

如果明确是要进行数字比较,则需要显示的转化为数字,例如使用parseInt、parseFloat;还有一种方法是使用减法运算符,如:v1 – v2 > 0,此时js在运算前内部会进行类型转换。

另外由于加法运算符同时支持数字和字符串,使用这个时候也要小心。例如 a + b ,如果其中一个是字符串类型,一个是数字类型,在执行运算前会把另外一个转化为字符串类型,所以实际是进行字符串链接操作,而不是想要的算术运算。在确定是要做算术运算的情况下,对于未知类型的参数,保险的情况下还是使用parseInt进行类型转换。

分类: web前端 标签:

js 快速排序引出参数传递是传值还是传引用

2013年3月27日 没有评论

http://www.ruanyifeng.com/blog/2011/04/quicksort_in_javascript.html这篇文章中详细描述了快速排序的原理,同时也给出了javascript的实现,其具体代码如下:

function quickSort(arr) {
    if (arr.length <= 1) {
        return arr;
    }

    var pivotIndex = Math.floor(arr.length / 2);
    var pivot = arr.splice(pivotIndex, 1)[0];
    var left = [];
    var right = [];

    for (var i = 0; i < arr.length; i++) {
        if (arr[i] < pivot) {
            left.push(arr[i]);
        } else {
            right.push(arr[i]);
        }
    }

    return quickSort(left).concat([pivot], quickSort(right));
}

上述代码也是比较通俗易懂,自己生成一个随机数组测试,排序正确,所以功能上也没有问题。但上述代码还是有一个隐藏的小bug,当对同一个数组调用两次quickSort,发现第二次条用后出来的元素数量会比原始数据少一个。导致这个问题是根源是arr.splice(pivotIndex, 1)[0],它会把arr中指定位置的元素删掉。其操作是针对该方法的参数,但是同时影响到了传给方法的实际数组,所以结论是javascript中数组参数的是传引用(地址),而非传值

为了不影响原始数组数据,可以对上述代码进行一个小修改,修改后的代码如下:

function quickSort(arr) {
    if (arr.length <= 1) {
        return arr;
    }

    var pivotIndex = Math.floor(arr.length / 2);
    var pivot = arr[pivotIndex];
    var left = [];
    var right = [];

    for (var i = 0; i < arr.length; i++) {
        if (i == pivotIndex) {
            continue;
        }

        if (arr[i] < pivot) {
            left.push(arr[i]);
        } else {
            right.push(arr[i]);
        }
    }

    return quickSort(left).concat([pivot], quickSort(right));
}

js定义多行字符串

2013年3月12日 1 条评论

当使用js来操作html,经常遇到需要处理多行字符串的问题,如果采用一行或多行拼接的方式都不好维护。像python、php中提供多行字符串的定义方式,真是方便不少。例如:

python
pstr = '''
line1
    line2
    line3
line4	  
'''

php 
$pstr = <<<eof
line1
    line2
    line3
line4
eof

上述定义完全保留字符串中的所有字符,包括回车换行已经引号等。

js本身没有提供类似的定义方式,但是可以通过多行注释(/* */),已经借助function的方式来达到多行字符的定义,例如代码:

var jstr = function() {
    var fun = function() {
    /*line1
        line2
        line3
    line4*/
    }
    var lines = new String(fun);
    
    return lines.substring(lines.indexOf("/*") + 3, 
                           lines.lastIndexOf("*/"));
}
分类: web前端 标签:

IE 6下cookie写入失败

2013年3月4日 1 条评论

一个简单的页面在加载的时候种植一个cookie,其他浏览器都能成功写入,测试IE 6时始终无法写入。由于是本地指定的一个测试三级子域,一度以为是域名长度问题,通过测试其他域名,排除了此问题。后来发现这个域名中使用了下划线,查了一下域名命名规范,规范规定域名只能是字母、数字和-(中划线)的组合,显然这不是一个规范的域名,IE 6自身机制拒绝种植cookie,所以导致失败。

想起曾经也碰到过IE 6通过js的方法无法在domain字符串少于5个字符的情况。也是源于IE 6自身的安全机制考虑的,可能在开发IE 6的时候还没有例如cn、uk、au之类的域名,其想当然的认为域名至少超过5个字符吧。

分类: web前端 标签:

mysql 查看数据库中所有表的记录数

2013年3月3日 没有评论

mysql使用select count(*) from table_name可以查询某个表的总记录数。想快速的知道数据库中所有表的记录数信息怎么办?如果使用mysql的版本在5.0及以上,可以通过查询information_schema库中的tables表来获取,该表中使用table_rows记录表的行数信息。例如查看库testdb中所有表的记录数:

use information_schema;

select table_name,table_rows from tables 
where TABLE_SCHEMA = 'testdb' 
order by table_rows desc; 

不过需要注意的是,对于InnoDB表,table_rows行计数仅是大概估计值。

另外一种办法还是借助information_schema库的tables表,来拼接出一个条sql语句,例如:

use information_schema;

select concat(
    'select "', 
    TABLE_name, 
    '", count(*) from ', 
    TABLE_SCHEMA, 
    '.',
    TABLE_name,
    ' union all'
) from tables 
where TABLE_SCHEMA='testdb';

把生成的结果手动加工一下就行了,起码比一张张表去拼写要来的快。

无觅相关文章插件,快速提升流量