Why this XBL example is not working?

StackOverflow https://stackoverflow.com/questions/3687686

  •  02-10-2019
  •  | 
  •  

문제

This example is from this Mozilla's page.

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>

Why it is not showing the box when I click the button?

도움이 되었습니까?

해결책

There are a few problems :

First of all in main.css you define a class okcancelbuttons yet in main.xul you refer to a labeledbutton class. The class can be called the same as the binding.

Secondly main.xml is just not valid xml (simplest way to validate is to load it up in firefox and it'll spit out errors). It needs xmlns attributes for each namespaces you use. In this case the "main" namespace, xbl and xul. They should be defined in the missing <bindings> element around the <binding> element.

It'll end up like this :

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>

다른 팁

Just try it out

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>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top