Почему этот пример XBL не работает?
Вопрос
Этот пример от Страница Mozilla.
Main.Xul.
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="main.css" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<box id="num" class="labeledbutton" title="Number of Things:" value="52"/>
<button label="Show" oncommand="document.getElementById('num').showTitle(true)"/>
<button label="Hide" oncommand="document.getElementById('num').showTitle(false)"/>
</window>
main.css.
box.okcancelbuttons {
-moz-binding: url('main.xml#labeledbutton');
}
main.xml.
<?xml version="1.0"?>
<binding id="labeledbutton">
<content>
<xul:label xbl:inherits="value=title"/>
<xul:label xbl:inherits="value"/>
</content>
<implementation>
<method name="showTitle">
<parameter name="state"/>
<body>
if (state) document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: visible");
else document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: collapse");
</body>
</method>
</implementation>
</binding>
Почему он не показывает коробку, когда я нажимаю кнопку?
Решение
Есть несколько проблем:
Прежде всего в main.css вы определяете класс okcancelbuttons
Тем не менее, в Main.xul вы относитесь к labeledbutton
сорт. Класс можно назвать так же, как привязка.
Во-вторых, Main.xml - просто недействительно, XML (простейший способ проверки - это загрузить его в Firefox, и он выпивет ошибки). Это потребность xmlns
атрибуты для каждого используемого пространства имен. В этом случае «основное» пространство имен, XBL и XUL. Они должны быть определены в пропавшем <bindings>
элемент вокруг <binding>
элемент.
Это заканчивается так:
main.xml.
<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl"
xmlns:xbl="http://www.mozilla.org/xbl"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<binding id="labeledbutton">
<content>
<xul:label xbl:inherits="value=title"/>
<xul:label xbl:inherits="value"/>
</content>
<implementation>
<method name="showTitle">
<parameter name="state"/>
<body>
if (state) document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: visible");
else document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: collapse");
</body>
</method>
</implementation>
</binding>
</bindings>
Другие советы
Просто попробуй
Xul (main.xul)
<box id="num" class="labeledbutton" title="Number of Things:" value="52"/>
<button label="Show" oncommand="document.getElementById('num').showTitle(true)"/>
<button label="Hide" oncommand="document.getElementById('num').showTitle(false)"/>
CSS (Main.css)
box.okcancelbuttons {
-moz-binding: url('main.xbl#labeledbutton');
}
Xbl (main.xbl)
<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl"
xmlns:xbl="http://www.mozilla.org/xbl"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<binding id="labeledbutton">
<content>
<xul:label xbl:inherits="value=title"/>
<xul:label xbl:inherits="value"/>
</content>
<implementation>
<method name="showTitle">
<parameter name="state"/>
<body>
if (state) document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: visible");
else document.getAnonymousNodes(this)[0].
setAttribute("style","visibility: collapse");
</body>
</method>
</implementation>
</binding>
</bindings>