MenuListの動的MenuItemsにCSSを追加する方法とXULでMenuItemの値を取得する方法

Question

画像に表示されているようにmenuListを作成します。

https://developer.mozilla.org/En/XUL:menuitem#Examples 私はFirefoxのウェブサイトでチェックすると、それは 「注：画像が表示されるのメニュー項目は、メニュー項目、象徴的なのクラスを持っていなければなりません。」と表示私はロードしてる私の場合は

をXULツリーから動的にmenuItemを取得します（XULツリーの値を取得してMenuListに追加します）。

これはメニューリストです：

<menulist id="firstname"> 
    <menupopup >  
    </menupopup> 
    </menulist> 

<menulist id="laastname"> 
    <menupopup>   
    </menupopup> 
    </menulist> 

CSSファイル： 「jarファイル：ファイル：//

.menu-iconic-left { 
    min-width: 1.45em; 
} 

.menu-iconic-icon { 
    width: 16px; 
    height: 16px; 
} 

menu.menu-iconic > .menu-iconic-left, 
menuitem.menuitem-iconic > .menu-iconic-left { 
    -moz-appearance: menuimage; 
    padding-top: 2px; 
} 

私は私のFirefoxブラウザのchromeディレクトリから、これらすべてのCSSコードを見つけました/C:/Program%20Files/Mozilla%20Firefox/chrome/classic.jar!/skin/classic/global/menu.css "を参照してください。

1. CSSを使用してアイコンメニュウリストを作成するにはどうすればよいですか？

私の2番目の問題は、menuItemの値を取得することです。私が上記のように、私はツリーセルのテキストを取得し、それをMenulistのMenuItemに追加することができます。 私は約8人のMenulistを持っており、ユーザーが値を選択することを決めた後、それらの値を取得してXMLファイルに追加したいと考えています。

私はこのようにしていますが、MenuListからMenuListの値を取得しているため、これが適切な方法ではないようです。

function mer() 
{ 
alert('one'); //This aler is working. 

var src = "\n\<CONTACT>\n\ 
\<FirstName>"+document.getElementById("firstname").value+"</FirstName>\n\ //the id of the menulist. 
\<LastName>"+document.getElementById("laastname").value+"</LastName>\n\  //the id of the seconf menulist. 
\</CONTACT>\n"; 

alert('one'); //This alert is not working. 

var node = srcToNode(src); 
alert(node); 
    if (objXMLDoc.childNodes && objXMLDoc.childNodes.length) { 
     for (var i = 0; i < objXMLDoc.childNodes.length; ++i) { 
    if (objXMLDoc.childNodes.item(i).childNodes && objXMLDoc.childNodes.item(i).childNodes.length) { 
     var x = objXMLDoc.childNodes.item(i).childNodes.length; 
     var lastNode = objXMLDoc.childNodes.item(i).childNodes.item(x-2); } } } 
objXMLDoc.appendChild(node); 
var textNode = document.createTextNode("\n"); 
objXMLDoc.appendChild(textNode); 

var textNode1 = document.createTextNode("\n"); 
objXMLDoc.appendChild(textNode1); 

var serializer = new XMLSerializer(); 
var prettyString = serializer.serializeToString(objXMLDoc); 
prettyString = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n" + prettyString; 
//saveFile(prettyString, "C:\\merge.xml"); 
alert('Merge is done'); 
document.getElementById('group').setAttribute("hidden", "true"); 

} 

function srcToNode(src) { 
    var domObject = (new DOMParser()).parseFromString(src, "text/xml"); 
    return domObject.documentElement; 
} 

2.私はmenuListのmenuItemsの値を取得し、それを自分のXMLファイルに更新できますか？

ご協力いただきありがとうございます。

Answer 1

まず、アイコン付きのメニューアイテムを作成するには、メニューアイテムのクラスに 'menuitem-iconic'を設定します。あなたは、メニューに 'menu-iconic'を含めて同じことをすることができます。たとえば：

<menulist id="metasyntactic" class="menu-iconic"> 
    <menupopup> 
    <menuitem class="menuitem-iconic" value="foo">Foo</menuitem> 
    <menuitem class="menuitem-iconic" value="bar">Bar</menuitem> 
    <menuitem class="menuitem-iconic" value="baz">Baz</menuitem> 
    </menupopup> 
</menulist> 

あなたはすでにこれを知っているかもしれませんが、メニューリストには、あなたのためのメニューアイテムを追加します非常に便利な方法を提供し、

document.getElementById("metasyntactic").appendItem("Zed", "zed"); 

することができます、第二に

（https://developer.mozilla.org/en/XUL/menulist#m-menulist.appendItemを参照してください） menulistのvalueプロパティを読み取るだけで、選択したmenuitemの値を取得できます。

var selectedValue = document.getElementById("metasyntactic").value; 

（https://developer.mozilla.org/en/XUL/menulist#a-valueを参照）