The Yahoo! User Interface Library (YUI)が2.4.1になっていました。
見逃していた・・・
YUI 2.4.1: Maintenance Release » Yahoo! User Interface Blog
IEのみ、メモリーリークする場合があるようなので、早めに2.4.1を使いたいと思います。
Yahoo! UI Libraryを使用して、select要素のオプションデータを非同期に取得するメモです。
サーバー側は、次のようなJSON形式のデータを返します。
JavaScript:
-
[{"id":"1","name":"test"},{"id":"2","name":"test2"}]
クライアント側のJavaScriptのサンプルです。
onLabelClickは、Yahoo! UI LibraryのTreeviewのラベルをクリックしたときに呼ばれる関数です。
JavaScript select要素に含まれるオプションの値の取得するメモです。
JavaScript:
-
var sel_elem = document.getElementById("sel_foo");
-
var sel_children = sel_elem.childNodes;
-
var count = sel_children.length;
-
for (var i=0;i<count;i++) {
-
var opt_elem = sel_children[i];
-
// オプションのテキスト
-
YAHOO.log(opt_elem.text);
-
// オプションの値
-
YAHOO.log(opt_elem.value);
-
}
Yahoo! UI Library Menuのメモ。
Yahoo! UI Library: Menuにあるサンプルのコードをもとにいろいろ試したのですが、最初はうまくメニュー(MenuBar)が表示されませんでした。
<body class="yui-skin-sam">のようにして、とりあえず表示されたサンプルをメモします。
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title> </title>
<link rel="stylesheet" type="text/css" href="js/yui/menu/assets/skins/sam/menu.css">
<script type="text/javascript" src="js/yui/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="js/yui/container/container_core-min.js"></script>
<script type="text/javascript" src="js/yui/menu/menu-min.js"></script>
<script type="text/javascript">
YAHOO.util.Event.onContentReady("basicmenu", function () {
var oMenuBar = new YAHOO.widget.MenuBar("basicmenu", { autosubmenudisplay: true, hidedelay: 750, lazyload: true });
oMenuBar.render();
});
</script>
</head>
<body class="yui-skin-sam">
<div id="basicmenu" class="yuimenubar yuimenubarnav">
<div class="bd">
<ul class="first-of-type">
<li class="yuimenubaritem first-of-type">
<a class="yuimenubaritemlabel" href="http://mail.yahoo.com">Yahoo! Mail</a>
<div class="yuimenu">
<div class="bd">
<ul>
<li class="yuimenuitem"><a class="yuimenuitemlabel" href="http://360.yahoo.com">360</a></li>
</ul>
</div>
</div>
</li>
<li class="yuimenubaritem first-of-type">
<a class="yuimenubaritemlabel" href="http://addressbook.yahoo.com">Yahoo! Address Book</a>
</li>
<li class="yuimenubaritem first-of-type">
<a class="yuimenubaritemlabel" href="http://calendar.yahoo.com">Yahoo! Calendar</a>
</li>
<li class="yuimenubaritem first-of-type">
<a class="yuimenubaritemlabel" href="http://notepad.yahoo.com">Yahoo! Notepad</a>
</li>
</ul>
</div>
</div>
</body>
responseXMLのデータを取得する部分で、4096バイトを超える文字列をFirefoxでは取得できませんでした。
IEでは問題ありませんでした。
xmldoc on Firefox - JavaScriptの方法で回避できました。
var xmldoc = o.responseXML;
if (typeof(xmldoc.normalize) != "undefined") {
xmldoc.normalize();
}
Yahoo UIのConnection Managerを使用しています。
Yahoo! UI Library: Connection Manager