Как сделать всю область из <box>в XUL кликабельной? - PullRequest
Новая
       6

Как сделать всю область из <box>в XUL кликабельной?

0 голосов
/ 19 сентября 2011

Пытаюсь немного изучить XUL, но я немного застрял. Создание очень простого списка альбомов для начала.

Скажем, у меня есть это поле - список песен начинается скрытым, но я хочу показать его, когда нажимаю на основное поле albuminfo. 

<box align="left" class="album"  id="test" orient="vertical">
    <box class="albumInfo" ><description value="Album 1" class="albumName"/><label class="albumArtist" value="Album artist 1"/></box>
    <box><label value="Year of release"/><label value="Genre"/></box>

    <listbox align="left" class="songlist" collapsed="true">
        <listitem label="Song 1"/>
        <listitem label="Song 2"/>
        <listitem label="Song 3"/>
        <listitem label="Song 3"/>
        <listitem label="Song 5"/>
    </listbox>
</box>

Как запустить команду Javascript, когда я щелкаю всю область albuminfo поля? Я могу отлично использовать кнопку, но я действительно хочу, чтобы вся область окна была интерактивной.

Ответы [ 2 ]

1 голос
/ 20 сентября 2011

вы можете сделать это многими способами в XUL.Так как вы спросили простой способ сделать это, нажав кнопку, здесь вы идете: 

    <?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<box align="left" class="album"  id="test" orient="vertical">
    <box class="albumInfo" ><description value="Album 1" class="albumName"/>
<label class="albumArtist" value="Album artist 1"/>
</box>
    <box><label value="Year of release"/><label value="Genre"/></box>

    <listbox align="left" class="songlist" collapsed="true" id="listBox" >
        <listitem label="Song 1"/>
        <listitem label="Song 2"/>
        <listitem label="Song 3"/>
        <listitem label="Song 3"/>
        <listitem label="Song 5"/>
    </listbox>
</box>
<row><button label="Album Info" oncommand="Open();"/> </row>

<script type="application/x-javascript">
<![CDATA[
   function Open()
{
document.getElementById('listBox').setAttribute("collapsed", "false");

}

]]>
</script>

</window>

Когда вы нажмете кнопку, вы получите информацию об альбоме !!!

Если нет, выВы можете использовать эту опцию, когда вы щелкаете в любом месте окна, вы открываете список, слегка изменяя выше. 

<box align="left" class="album"  id="test" orient="vertical" onclick="OpenInfo()">

function OpenInfo()
{
alert('hi');
document.getElementById('listBox').setAttribute("collapsed", "false");

}

Вы можете манипулировать списком разными способами.Для получения дополнительной информации, пожалуйста, проверьте эту ссылку: https://developer.mozilla.org/en/XUL_Tutorial/Manipulating_Lists

0 голосов
/ 20 сентября 2011

Пользователь может вызвать событие command в XUL несколькими способами.Например: щелкните элемент мышью, нажмите горячую клавишу по умолчанию ( Пробел или Введите для кнопки), когда фокус находится на элементе, щелкните метку элемента , нажмите клавишу доступа к элементу или метке элемента.Судя по звучанию вашего вопроса, вас действительно интересуют только щелчки мышью на самом элементе, и вам не нужны все дополнительные возможности, предоставляемые событием command.Это означает, что вы можете просто прослушать событие click: 

<box class="albumInfo" onclick="...">

Например, вы можете запустить существующий элемент <command>, если на элемент нажали: 

<box class="albumInfo" onclick="document.getElementById('album-info-command').doCommand();">
...