二次开发图片浏览系统应用Lightbox image viewer 2.03a并带javascript的字符串处理
定义一个数组变量：
var a=new Array();
定义时指定大小：
var a=new Array(20);
定义时赋初值：
var a=new Array('abc', 'def', 'ghi', 'opq');
转贴一个老大的blog先。呵呵,他总结的不错。
一、声明字符串:
var normal_monkey = "I am a monkey!<br>";
document.writeln("Normal monkey " + normal_monkey);
var bold_monkey = normal_monkey.bold();
document.writeln("Bold monkey " + bold_monkey);
这里的声明： var bold_monkey = normal_monkey.bold();
和下面对声明是等同的：
var bold_monkey = "<b>" + normal_monkey + "</b>";
第1个版本的声明看起来要简明得多。这里用到了字符串对象中
的bold对象，其他的字符串对象还有indexOf, charAt,
substring, 以及split, 这些方法可以深入字符串的组成结构。
首先我们研究一下indexOf。
2、indexOf
indexOf用于发现一系列的字符在一个字符串中等位置并告诉你子字符串的起始位置。如
果一个字符串中部包含该子字符串则indexOf返回returns "-1."
例子：
var the_word = "monkey";
//让我们从单词 "monkey"开始。
var location_of_m = the_word.indexOf("m");
//location_of_m(字母m的位置)将为0，因为字母m位于该字符串的起始位置。
var location_of_o = the_word.indexOf("o");
//location_of_o(字母o的位置)将为1。
var location_of_key = the_word.indexOf("key");
//location_of_key(key的位置)将为3因为子字符串“key”以字母k开始，而k
在单词monkey中的位置是3。
var location_of_y = the_word.indexOf("y");
//location_of_y)字母y的位置)是5。
var cheeky = the_word.indexOf("q");
//cheeky值是-1，因为在单词“monkey”中没有字母q。
indexOf更实用之处:
var the_email = prompt("What’s your email address?", "");
var the_at_is_at = the_email.indexOf("@");
if (the_at_is_at == -1)
{
alert("You loser, email addresses must
have @ signs in them.");
}
这段代码询问用户的电子邮件地址，如果用户输入的电子邮件地址中不包含字符 则 提
示用户＂＠你输入的电子邮件地址无效，电子邮件的地址必须包含字符@。＂
3、charAt
chatAt方法用于发现一个字符串中某个特定位置的字符。
这里是一个例子：
var the_word = "monkey";
var the_first_letter = the_word.charAt(0);
var the_second_letter = the_word.charAt(1);
var the_last_letter = the_word.charAt(the_word.length-1);
the_first_letter(第1个字符)是"m"
the_second_letter(第2个字符)是"o"
the_last_letter(最后一个字符)是 "y"
注意利用字符串的length(长度)属性你可以发现在包含多少个字符。在本例中，
the_word是"monkey"，所以the_word.length是6。不要忘记在一个字符串中第1个字符的
位置是0，所以最后一个字符的位置就是length-1。所以在最后一行中用了
the_word.length-1。>>
4、子字符串（substring）
子字符串（substring）和charAt有些象，不同之处在于它能够从一个单词中抓取整个的
子字符串，而不只是字母，这里是其格式：
var the_substring = the_string.substring(from, to);
"From"指的是子字符串中第１个字母的位置，"to"有点奇特，它是该子字符串中比最后
一个位置大１的位置．使用这种神奇的方法你可以标记子字符串的起始和结束位置，用
"to"的位置减去"from"的位置就会得出该子字符串的长度：
var the_string = "monkey";
var clergy = the_string.substring(0,4);
var tool = the_string.substring(3,6);
运行该段代码后变量clergy的值为"monk"; 变量tool的值为"key"。
子字符串常和indexOf一起使用，将字符串分成若干块．例如，
你可以从一个给定的URL中抽取出其域名：
var the_url = prompt("What’s the URL?","");
var lead_slashes = the_url.indexOf("//");
var domain_start = lead_slashes + 2;
var without_resource = the_url.substring(domain_start, the_url.length);
var next_slash = without_resource.indexOf("/");
var domain = without_resource.substring(0, next_slash);
这段代码的意思是：如果你输入
"http://www.webmonkey.com/javascript/index.html";，则域名就是
"www.webmonkey.com" ．如果这个方法对你来说有些麻烦，我将向你介绍如何使用split
方法简化其执行过程．但是首先我们作一些分析．
基本的技巧是将第１个斜杠和第２个斜杠之间的内容分离出来：
var the_url = prompt("What’s the URL?","");
//这行代码向用户询问一个URL．假设用户输入了
"http://www.webmonkey.com/javascript/index.html.";
var lead_slashes = the_url.indexOf("//");
这行代码确定第一个双斜杠的位置．在本例中lead_slashes的值是５，因为双斜杠的位
置从５开始．
你可能会想，通常的URL都是以http://开始，所以双斜杠的位置肯定是在５开始，为什
么还要加入indexOf这一段多余的代码呢？但是问题的关键在于你不知道用户在填入URL
时是否一定填入http:，他们也许会不小心多键入了一个空格，也许他们所键入的URL在
一个加密服务器上，其URL是"https://www.whatever.com/"; ．在编程你必须预料到种种
可能发生的问题．所以我们必须用indexOf方法确定双斜杠的确切的起始位置．
var domain_start = lead_slashes + 2;
这行代码用于计算该域名的第１个字母的起始位置．由于这里有一个双斜杠，所以域名
第１个字母的起始位置应该在双斜杠所在位置加２的位置．
var without_resource = the_url.substring(domain_start, the_string.length);
这段代码将域名起始位置往后的所有字符都提取出来．所以执行完这行代码后
without_resource是"www.webmonkey.com/javascript/index.html."
var next_slash = without_resource.indexOf("/");
这行代码计算出该字符串中下一个斜杠的位置，而从该字符串起始位置到这个斜杠之间
的内容就是域名．在本例中下一个斜杠的位置是17。
var domain = without_resource.substring(0, next_slash);
最后一步是提取出该字符串起始位置到下一个斜杠之间的所有内容．在本例中使得域名
等同于"www.webmonkey.com"。
这样做确实很麻烦，利用split方法则可以使该过程容易很多．>>
5、分割方法(splitting method)
你可以使用split方法用限位器来分割一系列的名称，然后将其
放在一个数组中．例如：
var my_friends ="trixie,moxie,sven,guido,hermes";
var friend_array =my_friends.split(",");
for (loop=0; loop < friend_array.length;loop++)
{ document.writeln(friend_array[loop] + " is myfriend.<br>");}
这段代码将字符串my_friends分割成包含５个元素的数组．JavaScript可以为你自动建
立一个数组，所以你无需使用new Array()．
将字符串分割成数组之后，我们使用了循环语句写出每一个名称．我们可以利用split方
法简化前面所讲到的域名提取：
var the_url = prompt("What’s the URL?","");
var first_split = the_url.split("//");
var without_resource = first_split[1];
var second_split = without_resource.split("/");
var domain = second_split[0];
这段代码简化了很多而且也更容易理解．我们来分析一些这段代码：
var the_url = prompt("What’s the URL?","");
提示用户输入一个URL，假设用户输入
"http://www.webmonkey.com/javascript/index.html"; ．
var first_split = the_url.split("//");
将用户输入的字符串分割成两块：first_split[0]是"http:"，first_split[1]是
"www.webmonkey.com/javascript/index.html."
var without_resource = first_split[1];
//提取出数组中的第２个元素，所以现在without_resource是
"www.webmonkey.com/javascript/index.html."
var second_split = without_resource.split("/");
将without_resource分割成３块：www.webmonkey.com,javascript, 和index.html．现
在你可以看到split的用途了吧？
结合我自己实际,也就写个例子20101229,开发blog系统中的子系统-图片展示系统，发现
(1)、js可以在aspx文件，也可以在aspx嵌套的ascx文件内用。例如我写的photo.aspx或者photo_show.ascx经过测试，效果是一样的，只要在cs文件中定义一个函数，return, 然后得到的值是可以传回aspx或者ascx文件的。前台可以调用，也就是ascx属于特殊的aspx吧，可以这里理解。
（２）、遇到的挑战在 Lightbox image viewer 2.03a ，这个东西是好东西，可以你点击的图片，以原图大小张开给你看，还有效果，还可以修改源代码，哈哈，太好了。以前的好象是１.０版本，我下了个２.０３a替换，然后二次再开发。
问题a、
var pics='<%=get_pic＿miaoshu()%>';／／获得数据库中的一串“图片描述”字符串一定要写再外面，不能写在function内，否则无效。
updateDetails: function() {
Element.show('caption');
Element.setInnerHTML( 'caption', imageArray[activeImage][1]);
if(imageArray.length > 1){
var pics_array=pics.split("|");//这句一定要写在要输出前的函数或者过程内，否则,无效,只能得到""空的字符串
Element.show('numberDisplay');
Element.setInnerHTML( 'numberDisplay', "Image " + eval(activeImage + 1) + " of " + imageArray.length+"//描述:"+pics_array[eval(activeImage)] );／／这里红色是图片显示时候显示对应描述的字段
}
new Effect.Parallel(
[ new Effect.SlideDown( 'imageDataContainer', { sync: true, duration: resizeDuration, from: 0.0, to: 1.0 }),
new Effect.Appear('imageDataContainer', { sync: true, duration: resizeDuration }) ],
{ duration: resizeDuration, afterFinish: function() {
// update overlay size and update nav
var arrayPageSize = getPageSize();
Element.setHeight('overlay', arrayPageSize[1]);
myLightbox.updateNav();
}
}
);
},
经过严格测试，算是解决了。这是很奇怪的。否则得到空字符串或者undefined字样。
３、当我弄好后以为可以了。但奇怪的是，所有“图片描述数据”顺序倒了过来，也就是字符串需要倒过来顺序，简单，我就在cs文件内做：
protected string get_pic＿miaoshu()
{
db.photo_type = System .Convert .ToInt32 ( Request.QueryString["type"]);
string pic="";
db d1 = new db_class(); //写好一个类文件，里面有通用的程序和模块。
string path = d1.accessdb();
for (int i=photo_rows;i>=1 ; i--)
{
photo_edit[i] = db.accessGetDataSet("select * from photo where photo_type=" + db.photo_type + "order by photoid ", path).Tables[0].Rows[i - 1]["photo_edit"].ToString();／／附值得到图片描述数据order by 很重要，否则,图片一多，取出来的值会乱顺序,我测试过
if (pic == "")
pic = photo_edit[i];
else
pic = pic + "|" + photo_edit[i];//“｜”是判断字符串数组的标志就像 １，２，３，４中的“，”而已
}
return (pic);
}
小结下：也就是cs获得数据第一，ascx获得数据第二，然后再给js处理，在js中读出，算是复杂的了。哈哈。给我解决了，神马也是浮云。以后，不用羡慕那些大网站上的图片浏览啦。我也可以做到了。
