存档

‘javascript’ 分类的存档

javascript split()方法

2009年3月16日 没有评论

javascript split()方法

split() 方法用于把一个字符串分割成字符串数组。

一个字符串数组。该数组是通过在 separator 指定的边界处将字符串 stringObject 分割成子串创建的。返回的数组中的字串不包括 separator 自身。

但是,如果 separator 是包含子表达式的正则表达式,那么返回的数组中包括与这些子表达式匹配的字串(但不包括与整个正则表达式匹配的文本)。

注释:如果把空字符串 (“”) 用作 separator,那么 stringObject 中的每个字符之间都会被分割。

注释:String.split() 执行的操作与 Array.join 执行的操作是相反的。

<script type=”text/javascript”>

var str=”How are you doing today?”

document.write(str.split(” “) + “<br />”)
document.write(str.split(“”) + “<br />”)
document.write(str.split(” “,3))

</script>

输出:

How,are,you,doing,today?
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
How,are,you

“2:3:4:5″.split(“:”) //将返回["2", "3", "4", "5"]
“|a|b|c”.split(“|”) //将返回["", "a", "b", "c", ""]

javascript split()方法特例::

使用下面的代码,可以把句子分割成单词:

var words = sentence.split(‘ ‘)

var words = sentence.split(/\s+/)

javascript split()方法实例::

公司自己的功能包里读取文章中的图片的时候不是仅仅读取src的值而是读的源代码结果形如:”<img src=’imgpath’/>”而首页上需要实现图片的循环显示效果,自己做了一个是直接切换,都说不好看如果有滤镜效果就好了,滤镜是需要指定 图片的他直接读出来一个图片我又没办法修改它,这时候split就派上用场了可以这样:
<script>
var td1=null;
var td2=null;

td1=”${requestScope.imgmap}”;(备注:td1赋值结果如下:”<img src=http://127.0.0.1:80/gyaspwebsite/suncerdata/site/img/shenbaomin20061227090437.jpg height=161   width=215 border=0>”;)
td2=td1.split(““);
alert(td2[1]);(可以看到td2=http://127.0.0.1:80/gyaspwebsite/suncerdata/site/img/shenbaomin20061227090437.jpg恩很实用   )
</script>

下面为详细介绍
<script>
var s
var ss=”h1hah2″;
s=ss.split(“a”);
alert(s.length);
alert(s[1]);
</script>
Microsoft(R) JScript(R)
split 方法   语言参考
版本 3
请参阅                   应用于
——————————————————————————–
描述
将一个字符串分割为子字符串,然后将结果作为字符串数组返回。
语法
stringObj.split(str)
split 方法的语法包括下述部分:
部分 描述
stringObj   必需的。要被分解的 String 对象或文字。该对象不会被 split 方法修改。
str   必需的。是一个字符串或正则表达式对象,描述用来定义分解位置的字符。
说明
split 方法的结果是一个字符串数组,在 stingObj 中每个出现 str 的位置都要进行分解。
下面的示例演示了 split 方法的用法:

function SplitDemo()
{
var s, ss;
var s = “The quick brown fox jumped over the lazy yellow dog.”;
// 在每个空格字符处进行分解。
ss = s.split(” “);
return(ss);
}

JS Charts

2009年3月15日 没有评论

Here are just a few examples of what JS Charts can do with your stats.
Please note that all the charts bellow are generated entirely with the JS Charts component!

演示:
http://www.jscharts.com/examples

====================================================

jQuery报表插件:
演示:
http://www.filamentgroup.com/lab/creating_accessible_charts_using_canvas_and_jquery/

分类: javascript 标签: ,

Javascript图片剪裁插件

2009年3月15日 没有评论

imgAreaSelect

imgAreaSelect这个jQuery插件能够选取一张图片中一个矩形区域。
imgAreaSelect

Image jQuery

Image Cropper

基于Prototype与script.aculo.us框架开发的图片修剪工具。其提供的功能与一些图片编辑工具相同。
Image Cropper

Image Prototype Script.aculo.us

Image Upload and Auto Crop

采用PHP+jQuery开发的图片上传和剪切(Crop)工具。
Image Upload and Auto Crop

Image jQuery Php

Jcrop

Jcrop是一个跨浏览器的jQuery图片剪切插件(jQuery image crop plugin)。支持对剪切框加CSS样式,当选取或拖动时添加回调事件(Callbacks),剪切时能够约束宽度与高度。
Jcrop

Image jQuery

Yahoo! UI Library ImageCropper

这是Yahoo! UI Library中提供的一个图片剪裁工具。易于使用和定制,该ImageCropper自带一种默认的剪裁框外观,但可以使用CSS进行扩展和定制。
ImageCropperYUIYahoo! UI Library ImageCropper

Image YUI

MooCrop

MooCrop是一个基于Mootools框架开发的图片剪切工具。
MooCrop

Image Mootools

UvumiTools

UvumiTools是一个功能强大的图片剪裁控件,基于Mootools框架开发。可以配置图片剪裁最小尺寸,保持剪裁区域长宽比例,实时预览剪裁图片等功能。
UvumiTools

Image Mootools

jQuery自动根据图片高度宽度缩放

2009年3月15日 没有评论

/* 自动缩略一些大图的小JS

吕 lvjiyong@Gmail.com
http://www.lvjiyong.com/tag/jquery/
更新:2007.9.22
更新2007.9.28

*/
jQuery.fn.ImageAutoSize = function(width,height)
{
$(“img”,this).each(function()
{
var image = $(this);
if(image.width()>width)
{
image.width(width);
image.height(width/image.width()*image.height());
}
if(image.height()>height)
{
image.height(height);
image.width(height/image.height()*image.width());
}
});
}
调用:先引用上面的脚本或将上页的脚本放入自己的JS库,然后只要再加 $(function(){ $(“图片组所在的容器”).ImageAutoSize(限制最大宽,限制最大高);});

分类: jQuery, 转载 标签: ,

精品jQuery插件收集

2009年2月22日 没有评论

jQuery插件

来源:http://parandroid.com/37-plug-ins-even-more-outstanding-jquery/

2) Accessible slider- Illustrations和代码显示如何最简单的制作一个滑动门UI控制条,而不需要任何Javascript或CSS知识.


7) IconDock- a jQuery JavaScript library 这个插件允许你创建一个类似于Mac OS X操作系统Dock菜单的特效菜单.

jQuery 手风琴效果

8 ) Horizontal Accordion-这个插件提供一些简单的选项可以让你轻松控制手风琴的展示效果.

9) HoverAccordion- 这个jQuery插件产生一个漂亮的二级层联菜单

jQuery图像浏览

10) Step Carousel Viewer-一个滑动门应用,内容区域可以是一张图片或是HTML富文本内容.

jQuery图表

12) jQuery + jFlot - 构图,绘画和图表

jQuery编辑器

14) Small Rich Text Editor - 体积小巧,跨浏览器,Ajax图像上传,HTML代码清理,基于PHP后端的富文本编辑器,功能十分全面.

  • Live Demo: Here
  • Download Code: From Here
  • 37个更加出色的jQuery插件

    作为开发人员来说,永远不会停止创建更加好用的Web交互应用脚本或程序,随着jQuery的流行,基于jQuery框架开发的插件几乎是数不胜数.关于jQuery插件,帕兰之前已经发过两篇文章介绍过很多强大的插件:

    但开发之路是永远不会停止的,Noupe又为我们收集整理了近期出现的37个出色的jQuery插件,帕兰映像翻译.

    jQuery滑动门

    1) Slider Gallery- 这是一个模仿Apple网站的jQuery滑动门产品展示. 这个‘产品展示滑动门’就是一个直线前进的画廊,在有限的空间里面显示产品图片,支持Tab标签的滑动和前进后退按钮的滑动.


    2) Accessible slider- Illustrations和代码显示如何最简单的制作一个滑动门UI控制条,而不需要任何Javascript或CSS知识.


    jQuery图像处理

    3) crop, labelOver and pluck-这个jQuery脚本可以让你的访客控制图像,实现截剪图片等操作.

    • Live Demo Of Crop: Here
    • Live Demo of LabelOver: Here

    4) Semitransparent rollovers -一个简单的脚本,让图像实现半透明效果

    • Live Demo Of Crop: Here

    5) Creating A Sliding Image Puzzle Plug-In- 创建出一个基于总容器的拼图效果,非常的特别.


    jQuery 导航菜单

    6) Digg Header- 这是一个仿Digg的导航菜单,宽度可变,下拉菜单,精美的搜索框,简单的颜色更改, 总之是有很多可取之处,很强大的一个导航菜单.


    7) IconDock- a jQuery JavaScript library 这个插件允许你创建一个类似于Mac OS X操作系统Dock菜单的特效菜单.


    jQuery 手风琴效果

    8 ) Horizontal Accordion-这个插件提供一些简单的选项可以让你轻松控制手风琴的展示效果.


    9) HoverAccordion- 这个jQuery插件产生一个漂亮的二级层联菜单


    jQuery图像浏览

    10) Step Carousel Viewer-一个滑动门应用,内容区域可以是一张图片或是HTML富文本内容.


    11) Featured Content Glider-可以在有限空间内展示不同的网页内容,通过分页导航和前后按钮进行操作,支持手动模式和自动的幻灯片播放模式.


    jQuery图表

    12) jQuery + jFlot - 构图,绘画和图表


    13) Accessible charts using canvas and jQuery - 用jQuery把HTML数据以可视化的概念展示出来,生成多种形式的图表,比如线性图,饼图,面积图等.


    jQuery编辑器

    14) Small Rich Text Editor - 体积小巧,跨浏览器,Ajax图像上传,HTML代码清理,基于PHP后端的富文本编辑器,功能十分全面.


    15)markItUp! Universal markup editor-这个插件可以让你把任何Textarea文本框转换成一个标识编辑器.目标编辑器包括Html, Textile, Wiki语法, Markdown, BBcode甚至是你自己的标识系统.


    jQuery Flash插件

    16) jQuery Flash Plugin-这个 jQuery插件可以让你嵌入Flash电影


    17) jMP3- jMP3提供一种简单的方法,通过一个Flash MP3音乐播放器,让你可以播放网路上面大多数的MP3音乐文件.
    using the sleek Flash Single MP3 Player & jQuery.

    jQuery Tab标签

    19) jQuery Tabs-典型的Tabs标签切换插件,没有Javascript可用.

    • Live Demo: Here
    • jQuery LightBox灯箱效果

      20) Fancy Box- 一个新鲜的Lightbotx灯箱效果的插件,主要特点包括自适应窗口图像,为全尺寸图像增加了一个很好,支持相关图像浏览.


      21) Thickbox Plus- Lightbox灯箱效果,自适应图像大.

      • Live Demo: Here
      • Download Code: From Here

      • 27) EasyDrag jQuery Plugin-一处简单的拖拽插件,可以让任何DOM元素实现拖拽效果,没有其它的功能,相对操作起来也就比较简单.


        28) Simple Effects Plugins- 一个新鲜的jQuery特效插件,可以实现闭合,隐藏,显示,褪色和滑动效果等.


        29) Slide out and drawer effect- 这是一个手风琴特效示例, 当鼠标悬浮在标题上面时,内容块就会展示. 这个插件最酷的地方在于其内容块保持了固定的高度.

分类: javascript, jQuery 标签: ,