博客园_零度的火

与jQuery UI的Accordion控件高度相似但可以同时展开多个区域的代码

2012-02-09T00:12:00Z

我在这里直接粘贴出代码作为备份：

首先是演示用的Html,这里我简化一点内容，使其更短一些

<h1>Toggle Panels</h1>
<div id="notaccordion">
  <h3><a href="#">Section 1</a></h3>
  <div>
    <p>
    Mauris mauris  ante, blandit et, ultrices a, suscipit eget, quam. Integer
   </p>
  </div>
  <h3><a href="#">Section 2</a></h3>
  <div>
    <p>
    Sed non urna. Donec et ante. Phasellus eu ligula.  Vestibulum sit amet
    </p>
  </div>
  <h3><a href="#">Section 3</a></h3>
  <div>
    <p>
    Nam enim risus, molestie et, porta ac, aliquam ac,  risus. Quisque lobortis.
    </p>
    <ul>
      <li>List item one</li>
      <li>List item two</li>
      <li>List item  three</li>
    </ul>
  </div>
  <h3><a href="#">Section 4</a></h3>
  <div>
    <p>
    Cras dictum. Pellentesque habitant morbi tristique  senectus et netus
    </p>
    <p>
    Suspendisse eu nisl. Nullam ut libero. Integer  dignissim consequat lectus.
     </p>
  </div>
</div>

然后是关键，jQuery代码：

 1 $.fn.togglepanels = function(){
 2   return this.each(function(){
 3     $(this).addClass("ui-accordion ui-accordion-icons ui-widget ui-helper-reset")
 4   .find("h3")
 5     .addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-top ui-corner-bottom")
 6     .hover(function() { $(this).toggleClass("ui-state-hover"); })
 7     .prepend('<span ></span>')
 8     .click(function() {
 9       $(this)
10         .toggleClass("ui-accordion-header-active ui-state-active ui-state-default ui-corner-bottom")
11         .find("> .ui-icon").toggleClass("ui-icon-triangle-1-e ui-icon-triangle-1-s").end()
12         .next().slideToggle();
13       return false;
14     })
15     .next()
16       .addClass("ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom")
17       .hide();
18   });
19 };
20 
21 $("#notaccordion").togglepanels();

本文链接

在jQuery Mobile中当调用listview的refresh函数之后，圆角变直角的问题

2012-01-31T09:13:00Z

jQuery Mobile 在我开发移动web站点的时候，帮了很大的忙，但是今天发现一个问题，就是在执行listview("refresh")函数之后，开了data-inset="true"的listview原来的圆角边框变成了直角边框了。。。经过调试发现，在调用refresh之后，listview中的第一个 li 的 class 缺少了 ui-corner-top，而最后一个 li 缺少了 ui-corner-bottom，解决的办法很简单，就是refresh之后把这2个class 加上。

1 // lv就是listview对象
2 lv.listview("refresh");
3 lv.find("li:first").addClass("ui-corner-top");
4 lv.find("li:last").addClass("ui-corner-bottom");

这或许应该算是一个bug吧～

本文链接

Linq to XML用XmlReader读取数据导致无法输出的格式化异常的问题

2011-12-15T07:19:00Z

我简直不敢相信这是真的。

XDocument类的Load方法利用XmlReader类读取一个模板XML文件，然后进行各种节点的增加操作最后利用Save方法存到文件去。结果发现输出的XML并没有很好的格式化，所有元素堆在一行上，各层节点之间没有换行。用尽了办法也没有发现为什么，把网络翻了个底朝天，结果一样，默认情况下，XDocument的Save方法会输出经过良好格式化的文本。但是为啥我这里就是不行呢？最后竟然发现，因为我用XmlReader作为XDocument加载原始数据的方法导致的，不要用XmlReader,换个比如StreamReader就可以了。神啊，怎么会这样？

本文链接

获取照片的拍摄日期

2011-11-20T13:45:00Z

整理照片是个麻烦事情。这几天有一批照片需要整理。需要按照拍摄日期进行重命名。经过文件复制之后，文件本身的日期早已面目全非，但是现在的相机的好处是会自动记录照片的很多独立的详细信息，比如照片的拍摄日期。那么怎么才能取到这些信息呢？一番查找，知道这些信息好像是叫做“EXIF”的格式信息。这个网站有它们的详细说明，基本上，每项信息包括ID，数值以及类型和长度等信息。这里我只关心拍摄日期。ID代表数据名称，比如16进制0x0132, 0x9003, 0x9004应该就代表拍摄日期，但具体区别我还不是很清楚，我怎么知道的那个值？从上面提到的那个网站里查到的，当然里面内容很长，看起来也有些复杂，我只是找到了它，然后一试才知道是正确的。知道了ID，那么对应的值是怎样的呢？ .NET Framework的Image类已经提供了PropertyItems集合，帮我们把这些信息按照ID建立了数组，而每个ID对应的值则是byte[]，也就是说，具体的可读内容，需要根据具体的数据类型自己去转换了。对于拍摄日期，谢天谢地，这byte[]不难解析，直接转换为ASCII字符串就是。

这是代码：

Image img = Image.FromFile(@"C:\Users\Protoss\Pictures\WP_000028.jpg");
System.Drawing.Imaging.PropertyItem[] items = img.PropertyItems;
string DateToken = System.Text.Encoding.ASCII.GetString(items.First(i => i.Id == 0x9003 || i.Id == 0x9004 || i.Id == 0x0132).Value);

本文链接

RDLC 2010设计器的数据源无法找到静态类作为数据源

2011-11-08T08:37:00Z

在RDLC 2010里面添加数据源，发现在Data Source下拉列表框中没有列出来我需要的类。最后发现是因为那些类是静态类，变成普通类之后就可以列出来了，但是类中的静态方法是可以正确列出来的。不晓得为什么不列出静态类，也许是因为设计器在内部总是会实例化数据源对象？

本文链接

兼容IE和FF的获取event对象和keycode的代码

2011-11-02T06:19:00Z

获取事件的event对象，以及获取按键码，其他浏览器也兼容

var evt = window.event || arguments.callee.caller.arguments[0];
var charCode = (evt.which) ? evt.which : evt.keyCode;

备忘。

本文链接

经过调整的JQuery Autocomplete控件

2011-09-20T00:45:00Z

发现JQuery Autocomplete 控件很好用，但是有些地方需要根据我的需要调整：

无论是否匹配上结果，都需要引发result事件（或者说调用result方法），这样我可以及时更新选中项对应的隐藏域的ID值，如果没有匹配项就更新一个负数ID值
如果设置minChars的值大于1，那么待选项就不显示了，这似乎是一个bug，修改一点代码解决。

这里是修改之后的js文件: jquery.autocomplete.js

本文链接

使用JQuery.Cookie的时候，记得增加path参数

2011-09-16T02:37:00Z

使用JQuery.Cookie还是很方便的，就是有些行为异常，按照通常的实例，使用以下代码就可以创建一个cookie并赋值：

1 $.cookie("currentMenuID", menuID);

不过只是这么做的话，发现有异常，通过跟踪发现，在多次使用这个代码之后，浏览器会发送多个具有相同Cookie名字值却不同的Cookie。 Google之后，在一个被墙的博客站点里发现了解决之道，就是需要指定cookie的path才行，于是，要这么做：

1 $.cookie("currentMenuID", menuID, { path: "/"});

问题解决了。

本文链接

JQuery的mbMenu控件中增加openOnLeft选项，以在主菜单的左边打开子菜单

2011-09-06T00:44:00Z

最近试用了JQuery的mbMenu控件来显示控件，功能还是挺强的，我是超级JavaScript小白，对JQuery也是小白中的小白，本着能用就好的态度使用这个控件。无奈遇到一个功能需求，即需要在主菜单的左侧显示子菜单，但是mbMenu默认在主菜单下方显示子菜单，也可以设置为在主菜单右侧显示子菜单，唯独没有功能允许在主菜单左侧显示子菜单，咋办？只能自己搞定了，好在目前只有一级子菜单。

以下是修改涉及的代码，留在这里只是作为一个存档。

首先增加一个openOnLeft参数，其中第7行是增加的代码

 1 options: {
 2     template: "yourMenuVoiceTemplate", // the url that returns the menu voices via ajax. the data passed in the request is the "menu" attribute value as "menuId"
 3     additionalData: "",
 4     menuSelector: ".menuContainer",
 5     menuWidth: 400,
 6     openOnRight: false,
 7     openOnLeft: false,
 8     containment: "window",
 9     iconPath: "ico/",
10     hasImages: true,
11     fadeInTime: 100,
12     fadeOutTime: 200,
13     menuTop: 0,
14     menuLeft: 0,
15     submenuTop: 0,
16     submenuLeft: 4,
17     opacity: 1,
18     openOnClick: true,
19     closeOnMouseOut: false,
20     closeAfter: 500,
21     minZindex: "auto", // or number
22     hoverIntent: 0, //if you use jquery.hoverIntent.js set this to time in milliseconds; 0= false;
23     submenuHoverIntent: 200, //if you use jquery.hoverIntent.js set this to time in milliseconds; 0= false;
24     onContextualMenu: function () { } //it pass 'o' (the menu you clicked on) and 'e' (the event)
25 },

以下代码包含对openOnLeft的处理，其中第18到22行是增加的代码

 1 switch (type)
 2 {
 3     case "sm":
 4         t = $(this).position().top + op.options.submenuTop;
 5 
 6         l = $(this).position().left + $(this).width() - op.options.submenuLeft;
 7         break;
 8     case "cm":
 9         t = this.mouseY - 5;
10         l = this.mouseX - 5;
11         break;
12     default:
13         if (op.options.openOnRight)
14         {
15             t = $(this).offset().top - ($.browser.msie ? 2 : 0) + op.options.menuTop;
16             l = $(this).offset().left + $(this).outerWidth() - op.options.menuLeft - ($.browser.msie ? 2 : 0);
17         }
18         else if (op.options.openOnLeft)
19         {
20             t = $(this).offset().top - ($.browser.msie ? 2 : 0) + op.options.menuTop;
21             l = $(this).offset().left - $(this.menuContainer).outerWidth() - op.options.menuLeft - ($.browser.msie ? 2 : 0);
22         }
23         else
24         {
25             t = $(this).offset().top + $(this).outerHeight() - (!$.browser.mozilla ? 2 : 0) + op.options.menuTop;
26             l = $(this).offset().left + op.options.menuLeft;
27         }
28         break;
29 }

本文链接

当Outlook无法自动检索邮件服务器设置时……

2011-08-02T02:13:00Z

我用Outlook 2010，配置我的公司邮箱，但是Outlook 总是在Search for abc@def.coms server settings 时出错。无法自动获取邮件服务器的设置信息。到底是哪一步出现了问题呢？google 之后发现这么一个地址：

https://www.testexchangeconnectivity.com/

利用它可以运行Outlook自动检索邮件服务器设置的过程，并且会列出一个详细的步骤和各种成功或失败的消息，通过查看结果信息，我们可以发现到底是哪一步出了问题。这地址一定要记下来，有用啊。

本文链接